1

jquery bookshelf Sliderを使用して本棚を作成しています。その動作は良好ですが、自分の本にいくつかの変更が必要です。

私たちの本のセルフデモリンク 本棚のデモ

変更内容は以下のとおりです。

  • デフォルトの読み込み時のタイトルとアイコンは非表示です。

  • タイトルやアイコンをクリックする必要がある場合。タイトルまたはアイコンを表示します。

スクリプトを以下に示します

<script type="text/javascript">



jQuery(document).ready(function() {



    //define custom parameters

    $.bookshelfSlider('#bookshelf_slider', {

        'item_width': '100%', //responsive design > resize window to see working

        'item_height': 320,

        'products_box_margin_left': 30,

        'product_title_textcolor': '#ffffff',

        'product_title_bgcolor': '#c33b4e',

        'product_margin': 20,

        'product_show_title': true,

        'show_title_in_popup': true,

        'show_selected_title': true,

        'show_icons': true,

        'buttons_margin': 15,

        'buttons_align': 'center', // left, center, right

        'slide_duration': 800,

        'slide_easing': 'easeOutQuart',

        'arrow_duration': 800,

        'arrow_easing': 'easeInOutQuart',

        'video_width_height': [500,290],

        'iframe_width_height': [500,330]

        }

    );



});//ready



</script>

すでに を に変更しようとしてい'product_show_title': true,ます

'product_show_title': false,

しかし、それは私にとってはうまくいきません。だからアドバイスしてください..

4

1 に答える 1

1

プラグインの初期化後に、タイトルとアイコンの不透明度を適切に設定します。

    //define custom parameters
    $.bookshelfSlider('#bookshelf_slider', {
        'item_width': 605,
        'item_height': 720,
        'products_box_margin_left': 30,
        'product_title_textcolor': '#ffffff',
        'product_title_bgcolor': '#c33b4e',
        'product_margin': 30,
        'product_show_title': true,
        'show_title_in_popup': true,
        'show_selected_title': true,
        'show_icons': true,
        'buttons_margin': 15,
        'buttons_align': 'center', // left, center, right
        'slide_duration': 800,
        'slide_easing': 'easeInOutExpo',
        'arrow_duration': 800,
        'arrow_easing': 'easeInOutExpo',
        'video_width_height': [600,600],
        'iframe_width_height': [600,600]
        }
    );

$(".show_hide_titles, .show_hide_icons").css('opacity','0.5');
$(".product_title, .icons_sprite").css('opacity','0');

デモ

于 2013-04-08T07:23:57.970 に答える