JQuery - 按钮单击时图像不向左或向右移动

时间:2015-11-26 18:23:17

标签: jquery



<!doctype html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <title>jQuery Test</title>
  <style>
    /* basic setup */
    * {
      margin: 0;
      padding: 0;
    }
    /* properties for html page */
    html {
      background-color: #008B8B;
    }
    /* Image properties */
    img {
      float: left;
      height: 120px;
    }
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

  <script type="text/javascript">
    $(document).ready(function() {
      $("img").addClass("wrappedElement");

      $("#Right-Shift").click(function() {
        $("img").slideRight();
      });

      $("#Left-Shift").click(function() {
        $("img").slideLeft();
      });
    });
  </script>
</head>

<body>
  <div id="header">
    <button id="Right-Shift">Right Shift</button>
    <button id="Left-Shift">Left Shift</button>
  </div>

  <div id="content">
    <img class="photo" src="images/photo1.jpg" alt="one">
    <img class="photo" src="images/photo2.jpg" alt="two">
    <img class="photo" src="images/photo3.jpg" alt="three">
    <img class="photo" src="images/photo4.jpg" alt="four">
    <img class="photo" src="images/photo5.jpg" alt="five">
    <img class="photo" src="images/photo6.jpg" alt="six">
  </div>
</body>
</html>
The JQuery in this html is Not working for left or right shift of images as given. Not sure this is correct, any pointer would be helpful
The JQuery in this html is Not working for left or right shift of images as given. Not sure this is correct, any pointer would be helpful
The JQuery in this html is Not working for left or right shift of images as given. Not sure this is correct, any pointer would be helpful
The JQuery in this html is Not working for left or right shift of images as given. Not sure this is correct, any pointer would be helpful
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

.slideRight不是本机Jquery函数。

http://api.jquery.com/?s=slide

这就是它无法正常工作的原因。

我建议自己编写函数或使用opensource JQuery轮播。 那里有很多开源旋转木马和滑块,所以不需要重新发明轮子。