Question

我想制作一个图片库，我只需点击上一张照片左半部分的任意位置，然后点击照片右侧的任意位置即可获得下一张照片。我在设置jQuery时遇到了问题

我有这个HTML代码

<tr><td align="center" width="6%"><span id="picviewer-prev" class="picviewer-area"><span></span></span><strong><a id="picviewer-prev" onclick="jQuery.image({ ajax:    'http://way2enjoy.com/jquery/photolove/785' });return false;" href="#"><img align="absmiddle" src="js/left.png"></a></strong></td><td width="57%" align="center">
<div id="imgtag" style="width:600px;"><img src="/upload/media_files/00/00/00/47/51/4751.photo.jpg" style="max-width:600px;margin-bottom:-3px;"></div></td><td align="top" width="6%"><span id="picviewer-next" class="picviewer-area"><span></span></span><strong><a id="picviewer-next" onclick="jQuery.image({ ajax: 'http://way2enjoy.com/jquery/photolove/787' });return false;" href="#"><img align="absmiddle" src="js/right.png"></a></strong></td><td width="31%" valign="top" style="background:#fff;overflow:hidden;"></td><td width="400" valign="top" style="padding-left:30px"><div class="hr"></div></td></tr>

CSS代码

  <style>
  #picviewer-prev 
  {
      left: -150px;
      right: 50%;
  }
  .picviewer-area {
      bottom: 0;
      cursor: pointer;
      display: block;
      position: absolute;
      top: 0;
      z-index: 10;
  }

  #picviewer-next {
   left: 50%;
   right: -150px;
  }
  .picviewer-area {
   bottom: 0;
   cursor: pointer;
   display: block;
   position: absolute;
   top: 0;
   z-index: 10;
  }
  </style>

的jQuery

    <script type="text/javascript">$(document).ready(function()

      { $("#picviewer-prev").click( prev );
     $("#picviewer-next").click( prev );

     });</script>

但是当我点击图片时没有任何反应。我认为我的jQuery错了。

jquery下一个上一个图像

0 个答案: