Question

我确信之前已经问过这个问题，但是我已经尝试了其他一些答案，到目前为止还没有任何答案。此外，这是一个两部分问题。

1。我需要在我的jquery image carousal中插入一个后箭头和下一个箭头。

以下是指向当前版本的链接：http://www.bmww.com/clients/index3/casestudies/cabrini_casestudy.html

即使插入箭头，我也需要使数字与图像保持高亮显示。我宁愿不改变过渡效果，除非由于某种原因我无法实现这一点。以下是我的代码，但如果您还需要其他任何内容来回答我的问题，请告诉我。

这是我的HTML代码：

  <div align="center" class="slideshow" style="height:500px; float:none">

   <ul style="margin-top:-30px">
  <li><img src="images/cabrini_1.png" alt="lemon" /></li><!--MUST ALWAYS HAVE THIS HERE AND BE THE SAME IMAGE AS NEXT IMAGE-->
  <li><img src="images/cabrini_1.png" alt="lemon tea" /></li>
  <li><img src="images/cabrini_2.png" alt="splashing lemon" /></li>
  <li><img src="images/cabrini_3.png" alt="salad with lemon" /></li>
  <li><img src="images/cabrini_4.png" alt="lemonade!" /></li>
  <li><img src="images/cabrini_5.png" alt="sliced lemon" /></li>
  <li><img src="images/cabrini_6.png" alt="dripping lemon" /></li>
   </ul>
 </div>

 <div id="casenumbers" align="right" style="margin-right:10px">


 <a href="#" class="change_link" onclick="$('.slideshow').blinds_change(0); return false"></a><!--MUST ALWAYS HAVE THIS HERE AND BE THE SAME IMAGE AS NEXT IMAGE BUT ALWAYS KEEP HIDDEN-->
 <a href="#" class="change_link" onclick="$('.slideshow').blinds_change(1); return false">1</a>
 <a href="#" class="change_link" onclick="$('.slideshow').blinds_change(2); return false">2</a>
 <a href="#" class="change_link"  onclick="$('.slideshow').blinds_change(3); return false">3</a>
 <a href="#" class="change_link"  onclick="$('.slideshow').blinds_change(4); return false">4</a>
 <a href="#" class="change_link" onclick="$('.slideshow').blinds_change(5); return false">5</a>
 <a href="#" class="change_link" onclick="$('.slideshow').blinds_change(6); return false">6</a>
 <a href="cabrini_casestudy2.html" class="ex1" >    &#187; </a>

 </div> <!--end slideshow div-->

这是我的CSS代码：

    <style>
    a{color: #666335;}
    a.clicked{ color: #D85D27;}
    </style>

和我的剧本：

        <script type="text/javascript">
        $(window).load(function () {
$('.slideshow').blinds();


    })
    $(document).ready(function(){
    $('a.change_link').click(function(){
$('.clicked').removeClass('clicked');
$(this).addClass('clicked');
});

    })
    </script>

2。我不知道你单击示例链接时是否都看到它，但有时当我弹出奇怪的滚动条时，整个图像列表会在加载所有内容之前显示一瞬间。是否有一大堆我可以添加的代码或一个可以出现的旋转轮，直到完全正确加载才会显示？

先谢谢大家!!对不起，我还在学习，所以我知道这可能看起来像一个简单或荒谬的问题。

Answer 1

准备好文件：

$(document).keyup(
    function(e)
    {
        if(e.keyCode == left)
            //decrement blinds
        else if(e.keyCode == right)
            //increment blinds
        else;//do nothing
    });

你必须查找右箭头和左箭头的keyCodes。

将下一个和后一个箭头添加到jquery幻灯片

1 个答案: