首页 / JQUERY / jquery按钮状态效果正常、移上、按下_jquery

jquery按钮状态效果正常、移上、按下_jquery

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了jquery按钮状态效果正常、移上、按下_jquery，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含1095字，纯文字阅读大概需要2分钟。

内容图文

在网页设计过程中，经常遇见按钮的各状态效果。写了一个jquery扩展，使这个过程更方便！
使用前注意引用Jquery；
JqueryExtend.js：
代码如下:

(function ($) {
// Button按钮的三种样式替换，如果isState参数为True则记录按下状态
$.fn.btnEffect = function (normal, mouseover, mousedown, isState) {
var lastButton;
this.each(function () {
$(this).bind({
mouseover: function () {
if (this != lastButton || !isState) {
$(this).removeClass().addClass(mouseover)
}
},
mouseout: function () {
if (this != lastButton || !isState) {
$(this).removeClass().addClass(normal)
}
},
mousedown: function () {
if (this != lastButton || !isState) {
if (lastButton != null) {
$(lastButton).removeClass().addClass(normal);
}

$(this).removeClass().addClass(mousedown);
lastButton = this;
}
}
});
});
}
})(jQuery);

示例页面Default.aspx：
代码如下:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="JqueryExtend_Default" %>





内容总结

以上是互联网集市为您收集整理的jquery按钮状态效果正常、移上、按下_jquery全部内容，希望文章能够帮你解决jquery按钮状态效果正常、移上、按下_jquery所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

扫描二维码推送至手机访问。

本文链接：https://qyyshop.com/info/317423.html

来源：【匿名】