jquery书架滑块修改

Question

我正在创建书架使用jquery书架滑块。它的运作良好，但我需要在自己的书本中进行一些修改。

我们的书自我演示链接 Book shelf demo

我们的修改给出如下：

• 默认加载时间标题和图标是隐藏。

• 如果我们需要点击标题或图标。显示标题或图标。下面

  <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, 

但它不是为我工作。所以请指教..

Answer 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'); 

DEMO