1

我确信以前有人问过这个问题,但是我尝试了其他一些答案,但到目前为止都没有。另外,这是一个两部分的问题。

1. 我需要在我的 jquery 图像轮播中插入一个后退箭头和下一个箭头。

这是当前链接的链接: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. 我不知道当您单击示例链接时大家是否都看到它,但有时当我这样做时,会弹出一个奇怪的滚动条,并且整个图像列表会在所有内容加载之前显示一瞬间。有没有我可以添加的代码块或者会出现一个旋转的轮子,所以在完全正确加载之前它不会显示?

提前谢谢大家!!抱歉,我还在学习,所以我知道这似乎是一个简单或荒谬的问题。

4

1 回答 1

0

在准备好的文件中:

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

您必须查找左右箭头的键码。

于 2012-06-01T19:42:45.197 回答