1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 | <script type="text/javascript"> //頁面初次載入 $(document).ready(function () { //在非同步回傳執行個體化期間引發 Sys.WebForms.PageRequestManager.getInstance().add_initializeRequest(InitializeRequestThis); //在完成非同步回傳之後,且已將控制項傳回瀏覽器時引發 Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestThis); //增加按鈕動畫效果 ChangeImager(); }); //在非同步回傳執行個體化期間引發 function InitializeRequestThis(sender, args) { } //在完成非同步回傳之後,且已將控制項傳回瀏覽器時引發 function EndRequestThis(sender, args) { //增加按鈕動畫效果 ChangeImager(); } //增加按鈕動畫效果 function ChangeImager() { //更換停用的按鈕圖片 $("input[type='image']").each(function (index) { if ($(this).attr("disabled")) { var Src; var Extension = $(this).attr("src").substring($(this).attr("src").lastIndexOf('.'), $(this).attr("src").length); if ($(this).attr("src").indexOf(" - Disable") > -1) { Src = ($(this).attr("src").substring(0, $(this).attr("src").lastIndexOf('.'))).replace(" - Disable", "") + " - Disable" + Extension; } else { Src = $(this).attr("src").substring(0, $(this).attr("src").lastIndexOf('.')) + " - Disable" + Extension; } $(this).attr("src", Src); } }) //增加移出移入的按鈕圖片 $("input[type='image']").each(function (index) { if (!$(this).attr("disabled")) { var Src = $(this).attr("src").substring(0, $(this).attr("src").lastIndexOf('.')).replace(" - Disable", "").replace(" - Action", ""); var Extension = $(this).attr("src").substring($(this).attr("src").lastIndexOf('.'), $(this).attr("src").length); $(this).mouseover(function () { $(this).attr("src", Src + " - Action" + Extension); }); $(this).mouseout(function () { $(this).attr("src", Src + Extension); }); $(this).mousedown(function () { $(this).attr("src", Src + " - Focus" + Extension); }); $(this).mouseup(function () { $(this).attr("src", Src + Extension); }); } }) } </script> |
2015年1月14日 星期三
[ASP][JavaScript]圖片按鈕的動畫效果(圖片切換)
訂閱:
張貼留言
(
Atom
)
沒有留言 :
張貼留言