spiqa logo

コーディング

【jquery】簡単に実装できるスクリプト4選

2019.08.29 Thu. コーディング

jqueryを使うと、WEBサイトにアニメーション等動きのあるデザインを実装できたり、要素の動的変更やHTMLを操作できたりととても便利です。
今回は、よく使うjqueryスクリプトをいくつかご紹介いたします。
jQuery本体の読み込みも忘れずに!

 

 

 

【httpで始まるリンクを別窓で開く】
httpで始まるリンクが全て別窓で開くようになります。
リンク1つ1つにtarget=”_blank”を記述しなくてもよくなるので便利です。

 

 

 

【特定のclass名を付けて囲んだ要素を〇秒かけて〇秒後にフェードアウトさせる】
フェードアウトすると、要素があった場所は無くなります。(display:none)
ロゴなどのアニメーション表示後にサイトを表示させたい時にも使えます。

 

 

 

【アコーディオンメニューの実装】
最近のWebサイトは、クリックすると隠れていたメニューやコンテンツが表示される機能が実装されていることが多いです。

 

・HTML

 

 

・jquery

 

 

 

【ページ内のスムーズスクロール】
ページ内を移動する時、スムーズなスクロールの動きをつけたほうが「同じページの中を移動したんだな」と認識しやすいので、実装するとより見やすいページになると思います。

 

 

ぜひご活用ください。

 

 

 

最新記事

もっと見る≫

カテゴリー

spiqa logo

スピカ

ホームページ制作、LP制作、広告運用はお任せください。
ロゴや名刺などのデザイン制作、また店舗販促物などもお作りします。
お客様の立場、ユーザーの立場の両方に立ち+αの価値を提供し続けます。

制作のご相談はこちらから