在这种情况下如何转化、翻译
How to transform, translate in this situation?
我想移动div.willshow
时,var约点击。但是我点击btn,它得到了类active
。我再点一下btn它就失去了类。如果我再点击一次,每个任务都不工作。
div.willshow {
width:calc(100% - 52px);
height:100%;
margin-left: 52px;
z-index:100;
background-color: white;
position: absolute;
left:-100%;
-ms-transition: -webkit-transform 0.5s ease-in-out;
-webkit-transition: -webkit-transform 0.5s ease-in-out;
transition: -webkit-transform 0.5s ease-in-out;
}
div.willshow.active {
-ms-transform: translate(-100%, 0); /* IE 9 */
-webkit-transform: translate(-100%, 0); /* Safari */
transform: translate(-100%, 0);
}
Javascript var about = $('ul.about > li > span');
var willshow = $('div.willshow');
about.click(function(){
willshow.addClass('active');
about.html('close');
about.click(function(){
willshow.removeClass('active');
about.html('about');
});
});
使用单个点击事件,在html函数中使用if来切换文本:
about.on('click',function(){
willshow.toggleClass('active');
about.html(function(){
if($(willshow).hasClass('active')) {
return 'close';
}
return 'about';
});
});
演示:https://jsfiddle.net/ztw7uxhy/1/
我认为你的脚本会更好地工作,使这样的东西
var about = $('ul.about > li > span');
var willshow = $('div.willshow');
var active;
about.click(function(){
if (active!='yes'){
willshow.addClass('active');
about.html('close');
active='yes';
else{
willshow.removeClass('active');
about.html('about');
active='no';
});
在about
点击处理程序中,您可以使用jQuery#toggleclass()来设置willshow
类,然后使用条件(三元)操作符,您可以以干净的方式获得适当的about
类:
var about = $('ul.about > li > span'),
willshow = $('div.willshow');
about.click(function () {
willshow.toggleClass('active');
about.html(willshow.hasClass('active') ? 'close' : 'about');
});
相关文章:
- 如何在javascript上使用flak-babel进行翻译
- 使用谷歌网站翻译器自动翻译网页
- jsi18n-django.catogue没有'不包含任何已翻译的字符串(但是djangojs.mo包含)
- Django'支持Javascript文件中的翻译
- “createImageData()”和“new ImageData(()”有何不同
- 如何翻译MySQL查询's ResultSet转换为整数
- 原生脚本无限翻译动画
- AngularJS无法使用translate值正确翻译
- 如何将此JS翻译成Angular2
- Angular JS:翻译带有大量文本的静态html页面
- DOM更改后的L20N翻译html
- Javascript翻译模板
- 将JavaScript oop代码翻译为Lua
- i10n angularjs分配翻译变量
- 为什么可以't I翻译JS画布图像
- 如何翻译SVG及其所有子项
- 翻译是从哪里来的?Java servlet、tomcat和Ext Js Sencha应用程序
- 谷歌的位置、坐标、速度如何转化为英里/小时
- 将 jQuery 代码翻译成普通的 JavaScript for Google Tag Manager
- 在这种情况下如何转化、翻译