LoginSignup
0
1

More than 3 years have passed since last update.

文系学生のプログラミング学習6日目ーjQueryプラグインー

Last updated at Posted at 2019-06-02

jQueryプラグイン

今日はjQueryプラグインを学習しました。ドットインストールではクリックしたときに画像のサイズを表示するものを作ったのですが、そもそも普段JavaScriptで書いているのと何が違うのかと疑問に思い、少し調べてみたところjQueryプラグインには様々な種類があるようです。

ざっくりまとめると、

・レイアウト系
・背景系
・スクロール系
・アニメーション系
・フォーム系

などがあるようです。
これらは既存出来たものをダウンロードすることで使えると思うのですが、GitHubというサイトにとんだあとどうすれば良いのか分からなかったので、調べてみたいと思います。

またJavaScriptとの大きな違いとしてコードの量が大幅に少なくなるそうです。
時間があるときに同じ機能を2つで書き比べてみたいです。

プラグインの方法

方法としては、

1.jQuery本体を読み込む
これは公式サイトからダウンロードして、

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

とHTMLに記述します。

2.jQueryプラグインを読み込む

例えばslickを使うとすると、

<script src="./js/slick.js"></script>

と書きます。

3.プラグインの起動スクリプトを書く

最後にプラグインを実際に動かすスクリプトを以下のように書きます

<script>
jQuery(function($) {
  $('.slides').slick();
})

ざっとまとめましたが、こんな感じでしょうか。
このあとは実際にコードを修正していきます。

注)起動スクリプトは必ずjQuery本体とプラグインを読み込んだあとに記述するそうでし

終わり

0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1