jquery显示从右到左隐藏onclick答案

【问题标题】：jquery show hide right to left onclickjquery显示从右到左隐藏onclick
【发布时间】：2013-08-16 23:00:57
【问题描述】：

我正在尝试获得一种效果，我可以单击图像以显示搜索表单，并将 div 从右向左展开

这是我尝试过的代码

html

 <div class="searchbox">
 This is some text that I need to hide.<span class="clickme">Click Me</span>
 </div>

css

 .searchbox {
  height: 20px
  overflow: hidden;
  }

jquery

  $( ".clickme" ).click(function() {
  $( ".searchbox" ).animate({
  left: "+=100",
  width: "toggle"
  }, 500, function() {
  });
  });

感谢您的帮助！

【问题讨论】：

问题是？你的 jQuery 代码在哪里？
我已经编辑显示我正在尝试的 jquery，谢谢！
我的代码遇到的问题是，当 div 折叠时，它会将 div 的高度推高，然后整个东西就消失了。
阅读文档api.jquery.com/animate

标签： jquery expand right-to-left

【解决方案1】：

这就是我最终做的：

HTML

 <div>
 <div class="searchbox" data-thmr="thmr_80">
 <img class="clickme" data-thmr="thmr_80" src="/sites/default/files/sherlock.png">
 </div>

CSS

 .clickme {
 left: 720px;
 position: relative;
 top: 17px;
 }

.searchbox {
 display: none;
 float: right;
 height: 50px;
 overflow: hidden;
 width: 275px;
 }

jQuery

 $(document).ready(function(){

    $( ".clickme" ).click(function() {
    $( ".searchbox" ).animate({
    width: "toggle"
    }, 500, function() {
    });
    });

});

【讨论】：

【解决方案2】：

您正在寻找 jQuery .animate() 方法。他们的 API 站点有文档和示例：.animate documentation can be found here

【讨论】：