LoginSignup
9
9

More than 5 years have passed since last update.

jQuery Plugin パラメーターの代わりにdata属性で代用できるプラグイン

Last updated at Posted at 2014-06-21

site: http://develo.org/jquery.dataExtend
GitHub: https://github.com/kamem/jquery.dataExtend

プラグインを複数のページなどで違う動作をしたい場合に
わざわざjsを用意して指定し直さないければいけないのが煩わしいと思っていたので
かわりにdata-*で指定したパラメーターを使うことができるjQuery プラグインを作りました。

DEMO

仕様

  • 下記のようなプラグインがあった場合に

    $('.tab').tab{
        timer: 1000,
        num: 1,
        isSessionStorage: true
    };
    
  • 下記のようにHTMLのdata属性を代わりに使うことができます。

    <p class="tab" data-timer="1000" data-num="1" is-session-storage="true">
    

使い方

  1. スクリプトの記述(プラグインの後にjquery.dataExtend.jsを読むこむ)

    <script src="js/jquery.js"></script>
    <script src="js/jquery.tab.js"></script>
    <script src="js/jquery.dataExtend.js"></script>
    
  2. $('適応したいタグ').dataExtemd('プラグイン名');

    <script>
    $(function(){
        $('.nav').dataExtend('tab');
    });
    </script>
    
  3. HTMLにdata属性を記述する(キャメルケースの場合「-」でつなげる)※ is-session-storage = isSessionStorage

    <p class="tab" data-timer="1000" data-num="1" is-session-storage="true">
    
9
9
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
9
9