Toggle.slide.right在移动设备上无法正常工作

时间:2019-06-18 11:12:53

标签: javascript jquery html css

向右切换不能在移动版本中按需使用,它从中间显示。完整版本的台式机还可以。 示例:https://streamable.com/eiy8c

$("#buttonStart").click(function() {
  {
    $('#content101').toggle('slide', {
      direction: 'right'
    }, 500);
  }
});

$("#buttonClose").click(function() {
  {
    $('#content101').toggle('slide', {
      direction: 'right'
    }, 500);
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="buttonStart">
<input id="buttonClose">
<div id="content101">
  Content
</div>

我尝试向左切换,没关系。

2 个答案:

答案 0 :(得分:1)

  

改为使用animate()函数。

<!DOCTYPE html>
    <html>
    <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
    <script> 
    $(document).ready(function(){
      $("button").click(function(){
        $("div").animate({left: '250px'});
      });
    });
    </script> 
    </head>
    <body>

    <button>Start Animation</button>

    <p>By default, all HTML elements have a static position, and cannot be moved. To manipulate the position, remember to first set the CSS position property of the element to relative, fixed, or absolute!</p>

    <div style="background:#98bf21;height:100px;width:100px;position:absolute;"></div>

    </body>
    </html>

答案 1 :(得分:-1)

放弃ID的方法,并尝试按其类切换它们。看看它是否工作?