小编Tho*_*sen的帖子

我有一个 JQuery 幻灯片，其中一些文本/幻灯片淡入淡出。

同时我有一个导航/点可以点击。当您单击某个位置时，幻灯片/文本会发生变化。

问题是当文本/幻灯片褪色并且用户单击某个位置时，褪色会中断。如果用户快速点击所有的点，就会同时显示来自不同幻灯片的文本。

我希望褪色结束，然后用户可以点击。简而言之：褪色时没有点击。

我做了一个小例子来说明这个问题。

html的头部：

<style type="text/css">
     .slideshow
     {
         width:600px;
         height:30px;
         background-color:#0FF;                      
         overflow:hidden;
         margin:50px;
     }
     .slideshow_text_font
     {
         font:Verdana, Geneva, sans-serif;
         font-size:22px;
         font-weight:bold;       
     }
  </style>

  <script type="text/javascript" src="js/jquery.min.js"></script>
  <script type="text/javascript" src="js/jquery.cycle.all.latest.js"></script>

  <script type="text/javascript"> 
     $(document).ready(function() {
         $('.slideshow').cycle({                        
            fx: 'custom',
             sync: 0,
             cssBefore: {
                 opacity:0,
                 display: 'block'
             },
             animIn:  {
                 opacity:1               
             },
             animOut: {
                 opacity:0
             },
             timeout:5000,
             speed:2000
         });
     });

     if (document.images) {
         function setSlide(index) { 
           $('.slideshow').cycle(index);
         } 
     }
   </script>

html的正文部分：

<div class="slideshow">
    <div><a class="slideshow_text_font">1. Some text for slide …