小编mar*_*rky的帖子

我已经搜索了高低的答案并找到了类似的问题示例,但答案并不适用于我的场景.现实是我是新手,因此我没有技能来调整我发现的问题的答案.

问题:

我有一个Div,当点击缩略图时,Div图像会通过JavaScript/jQuery脚本替换另一个图像(我不确定是否有人可以澄清).这工作正常,但问题是页面滚动回到顶部,然后用户必须向下滚动以查看替换后的图像.

我已经在线查看并发现返回false:在JavaScript中可能会有所帮助但是我已经查看并且返回false已经存在.

我使用的另一个选项是基于JavaScript cookie的解决方案,其中发送cookie,并且通过读取cookie来维护浏览器滚动位置但是我似乎无法使该解决方案起作用,我认为问题可能是由此引起的因为我在当地托管,但我可能错了......

第三个是使用PHP脚本,但我还没有找到关于这个方法的明确答案,这也意味着我将不得不学习PHP(我确信无论如何我都必须及时学习).

这是JavaScript:

<script type="text/javascript">

 $(document).ready(function() {
  $('.galleryicon').live("click", function() {

    $('#mainImage').hide();
    $('#cakebox').css('background-image', "url('ajax-loader.gif')");
    var i = $('<img />').attr('src',this.href).load(function() {
        $('#mainImage').attr('src', i.attr('src'));
        $('#cakebox').css('background-image', 'none');
        $('#mainImage').fadeIn();
    });
    return false; 
   });
 });

</script>

这是html:

<div class="cakecont">

  <div id="cakebox">

 <img src="../images/cakes/babycake1.png" alt="Main Image" id="mainImage"/>

     <div class="pageinfo2">
     <h3>Cake Type 1</h3>
     <h6>£2.00</h6>
     </div>
     <div class="infobox">
     <h6> Description </h6>
     </div> 

      <div class="gallerybox">
      <a href="../images/cakes/babycaketop.png" class="galleryicon">
      <img src="../images/thumbs/babycaketopsml.png" alt="Thumbnail 2"/></a>

      <a href="../images/cakes/babycake1.png" class="galleryicon">
      <img src="../images/thumbs/babycakesml.png" alt="Image 1"/></a>
   </div>
  </div>
</div>

这里有一个工作演示的链接http://micahcarrick.com/code/jquery-image-swap/index.html

我试图自己解决这个问题.这是我到目前为止关于建立我的网站的第一个问题,我对谷歌提供的所有学习和过去问题的补救措施,这一点已经躲过了我的搜索引擎技能. …