0

我想制作一个图片库,我只需单击图像左半部分的任意位置以获取上一张照片,并单击照片右侧的任意位置以获取下一张照片。我在设置 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 是错误的。

4

0 回答 0