jquery 按钮效果 正常、移上、按下
生活随笔
收集整理的這篇文章主要介紹了
jquery 按钮效果 正常、移上、按下
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
在網頁設計過程中，經常遇見按鈕的各狀態(tài)效果。寫了一個jquery擴展，使這個過程更方便！
使用前注意引用Jquery；
JqueryExtend.js：
示例頁面Default.aspx：
?
?
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="JqueryExtend_Default" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"><title></title><script src="../jquery-1.7.1.js" type="text/javascript"></script><script src="JqueryExtend.js" type="text/javascript"></script><style type="text/css">.btn{border: 0px;background: red;}.btn1{border: 0px;background: green;}.btn2{border: 0px;background: yellow;}</style><script type="text/javascript">$().ready(function () {$("#aa,#bb").btnEffect("btn", "btn1", "btn2", true);$("#cc").btnEffect("btn", "btn1", "btn2", false);});</script> </head> <body><form id="form1" runat="server"><div><input id="aa" class="btn" type="button" value="按鈕1" /><input id="bb" class="btn" type="button" value="按鈕2" /><input id="cc" class="btn" type="button" value="按鈕3" /></div></form> </body> </html>?
?
轉載于:https://www.cnblogs.com/dyllove98/p/3249282.html
總結
以上是生活随笔為你收集整理的jquery 按钮效果 正常、移上、按下的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： flask tutorial = mak
- 下一篇： 新车保险买哪几种