如何在jQuery mouseout上应用原始样式
How to apply original style on jQuery mouseout
我在背景图像上应用了淡出效果。如何在鼠标移出时慢慢恢复原来的样式?
jsfiddle: http://jsfiddle.net/KevinOrin/H6Q3J/
jQuery('.square-section').mouseover(function(){
jQuery(this).fadeTo('slow',0.3, function(){
jQuery(this).css('background-image', 'url(' + $img + ')');
}).fadeTo('slow',1);
});
您首先没有使用$img variable
..所以在第一个中不需要回调函数。
如果您要完全更改图像,则回调函数可能处于帮助状态。
jQuery('.square-section').hover(function(){
jQuery(this).fadeTo('slow',0.3);
}, function() {
jQuery(this).fadeTo('slow',1);
});
检查小提琴
如果你想交换两个不同的图像,你可以试试这个方法
jQuery('.square-section').hover(function(){
jQuery(this).fadeTo('slow', 0.3, function() {
jQuery('.square', this).removeClass('square-chess').addClass('square-chart');
jQuery(this).fadeTo('fast', 1);
});
}, function() {
jQuery(this).fadeTo('fast', 0.3, function() {
jQuery('.square', this).removeClass('square-chart').addClass('square-chess');
jQuery(this).fadeTo('fast', 1);
});
});
jQuery('.square-section').hover(function () {
jQuery('.square', this).removeClass('square-chess').addClass('square-chart');
}, function () {
jQuery('.square', this).removeClass('square-chart').addClass('square-chess');
});
jQuery('.square-section').mouseout(function(){
jQuery(this).fadeTo('slow',0.3, function(){
jQuery(this).css('background-image', 'url(' + $img + ')');
}).fadeIn('slow',1);
});
相关文章:
- 如何将HTML id分配给元素,以及如何将JavaScript应用于元素
- 使用 jQuery 的 .on 函数如何获取事件的原始元素
- Canvas Html5绘图应用程序,移动画布会导致重大问题
- Emberjs应用程序加载在除Index之外的所有路由上
- 使用电话间隙在Android应用程序中显示SQL Lite的数据
- 跟踪在页面加载时应用内联样式的JavaScript
- 在AngularJS应用程序中使用封装指令和路由的推荐方式是什么
- 如果文本字段为空,则使用JavaScript应用CSS样式
- Javascript - 将过滤器应用于画布并重置为原始
- 如何覆盖 Javascript 中的方法并将其应用于原始对象,而不是子对象
- 用于解析 Chrome 打包计算器应用中的原始输入的网络辅助角色
- 添加新的第一个参数,然后应用原始参数
- 如何从视频游戏应用程序中的原始语法中获取@commit标签ID列表
- 有可能用我的新上下文而不是原始的应用程序上下文来伪造WebView的构造函数吗
- 在原始图像上应用camanJS过滤器
- 如何在jQuery mouseout上应用原始样式
- 如何在Node.js web应用程序中访问原始(或完整)X509证书?
- 使用attr()将样式应用于原始html失败
- 在页面中包含html文件,而不应用原始页面的CSS/JS
- 如果至少有一个输入不是原始的,我如何将CSS应用于链接,如果所有输入都是原始的,我如何撤销该更改?