我有一个JavaScript函数,如下所示:

function toggle() {
  $('.sidebar').toggle();
}

这我可以为边栏添加一些CSS:

.sidebar {
  transform: translate3d(-280px, 0px, 0px);
  position: absolute;
  width: 280px;
  background: #263249;
  color: #eee;
  left: 0;
  height: 100%;
  transition: all .3s;
}

现在此边栏已隐藏,但是当我运行切换功能时,我需要它来切换此值:

transform: translate3d(0px, 0px, 0px);

我怎样才能做到这一点?

#1楼 票数:1 已采纳

您可以使用toggleClass

 function toggle() { $('.sidebar').toggleClass('newValue'); } 
 .sidebar { transform: translate3d(-280px, 0px, 0px); position: absolute; width: 280px; background: #263249; color: #eee; left: 0; height: 100%; transition: all .3s; } .newValue { transform: translate3d(0px, 0px, 0px); } 

  ask by brianf2005 translate from so

未解决问题?本站智能推荐:

2回复

使用JQuery.Toggle和CSS转换按钮

我尝试使用切换功能显示菜单。 菜单显示,然后隐藏其自身,而无需两次单击按钮。 我已经添加了 e.preventDefault(); 并奏效了,但按钮不再按应有的方式变形了? $(document).ready(function() { $(".spinner-master2")
3回复

jQuery.toggle。动画

我想切换一个动画。 您能帮我弄清楚为什么这个jquery代码不起作用吗? 在这里摆弄 谢谢你的帮助!
1回复

jQuery.toggle堆叠样式

我在使用.toggle上下滑动元素时遇到问题,问题是当我尝试将光标快速移到项目上时会弄乱。 元素的id被删除,我得到了jQuery分配的自定义样式。 我该如何解决? 我尝试使用.stop,但不能解决问题。 我尝试减少动画时间,但是问题仍然存在。 .js代码 的HTML
3回复

jQuery动画-webkit-transform

是否可以使用jQuery动画webkit translate3d? 我读到,当使用jQuery的animate属性时,你必须使用css属性,但在translate3d的情况下,这似乎不起作用。 我有以下代码,我想动画而不是它立即发生? 为了澄清“e”是一个传递给我上面的代码运行的函数
3回复

jQuery.click()激活addClass(),并且类使用transform:转换以移动元素

我正在制作一个带有两个箭头的图像滑块。 例如,当.rightArrow .click() .rightArrow ,将添加一个名为.moveRight的类( .addClass() )。 问题在于此click事件仅触发一次 。 我想这是因为我要告诉可移动元素去特定的位置。 我希望元素
1回复

通过jQuery设置转换值

我想设置值: 转换div标签的CSS属性。 我使用下一条命令: 但是我什么也没改变。 我该如何设置?
1回复

jquery-free-transform+AngularJS

我在让https://github.com/gthmb/jquery-free-transform和AngularJS正常工作方面遇到困难。 缩放和旋转的控件没有获得附加元素的宽度/高度。我正在使用指令将jQuery.freetrans()附加到动态生成的元素上。 类名例如是“图像”。
3回复

无法使用js获取Toggle开关的值

以下是我正在研究的我的小型项目。它有两个Toggle开关,根据OnClick Function显示是/否的开关状态。 我需要1.提醒相应的拨动开关的值2.在“状态”下的同一页中显示相同的值。 我已经插入console.log来检查我得到的输出。 仅第一个拨动开关值是和否都正确显示