2014-10-05 64 views
0

我有一个jQuery脚本,从右向左滑动一个名为.inner的div。但问题是,它会用class .inner切换所有的div。我需要做些什么来切换.next().inner?jQuery切换下一个div

$(document).ready(function() { 
    // This will fire when document is ready: 
    $(window).resize(function() { 
     // This will fire each time the window is resized: 
     if($(window).width() <= 768) { 
      // if larger or equal 
      $(".myButton").click(function() { 

       // Set the effect type 
       var effect = 'slide'; 

       // Set the options for the effect type chosen 
       var options = { direction: $().val('right') }; 

       // Set the duration (default: 400 milliseconds) 
       var duration = 500; 

       $('.inner').toggle(effect, options, duration); 
      }); 
     } else { 
      // if smaller 
      $('.element').hide(); 
     } 
    }).resize(); // This will simulate a resize to trigger the initial run. 
}); 

谢谢

编辑:

HTML:

<div class="col-xs-1 col-md-1"> 
    <span class="glyphicon glyphicon-th-list icons-popover myButton" data-html=true data-popover="true" data-content="       
    <div class='actions'> 
     <a href='#' data-toggle='tooltip' data-placement='top' title='Something'><span class='glyphicon glyphicon-file'></span></a> 
    </div>"> 
    </span> 
</div> 
<div class="inner" style="margin-left: 0px;"> 
     // somethinh     
</div> 
<div class="close myButton"><span class='glyphicon glyphicon-remove'></div> 
+0

$(本) .next('。inner') – 2014-10-05 11:06:42

+0

它不适用于next()。当我申请下我的脚本停止工作 – 2014-10-05 11:21:20

回答

0
$(this).next('.inner').toggle(effect, options, duration); 
+0

我试过$(this).next()但它不起作用 – 2014-10-05 11:08:48

0

我找到了答案:

$(".myButton").click(function() { 

       // Set the effect type 
       var effect = 'slide'; 

       // Set the options for the effect type chosen 
       var options = { direction: $().val('right') }; 

       // Set the duration (default: 400 milliseconds) 
       var duration = 500; 

       $(this).parent().next('.inner').toggle(effect, options, duration); 

      }); 
      $(".close").click(function() { 

       // Set the effect type 
       var effect = 'slide'; 

       // Set the options for the effect type chosen 
       var options = { direction: $().val('right') }; 

       // Set the duration (default: 400 milliseconds) 
       var duration = 500; 

       $(this).parent('.inner').toggle(effect, options, duration); 


      });