文件上傳按鈕閃爍使用mousequery和mouseleave與Jquery

文件上傳按鈕有點麻煩。我不能在我的生活中使mouseenter和mouseover效果無閃爍地發揮作用。文件上傳按鈕閃爍使用mousequery和mouseleave與Jquery

我認爲這可能是相當直接的，但我是一個jQuery新手。

這裏是小提琴：

jsfiddle.net/dingobruce/tdgn2/4/

jQuery的：

$(function(){ 
    var btnUpload=$('#upload_main'); 
    new AjaxUpload(btnUpload); }); 
$("#upload_main").mouseenter(function() { 
$("#upload_main").addClass("upload_button_on");}); 
$("#upload_main").mouseleave(function() { 
$("#upload_main").removeClass("upload_button_on");});

和HTML代碼：

<div id="container"> 
<div id="upload_main" class="upload_button"> 
Upload 
</div> 
</div>

而且CSS

.upload_button { 
border-color:#DADADA; 
color:#000000; 
border-width:1px; 
border-style:solid; 
font-family:'gothic_bold'; 
font-size:13px; 
background:#ECECEC; 
text-align:center; 
text-transform:uppercase; 
padding:5px; 
width:115px; 
} 

.upload_button_on { 
color:#FFFFFF; 
background:#000; 
text-decoration:none; 
border-color:#000000; 
cursor:pointer; 
}

任何幫助或指針非常感謝！

感謝，

dingobruce

來源

2014-08-29 Dingo Bruce

郵編_on_網站。對我來說工作得很好。你使用什麼瀏覽器？ – Idris 2014-08-29 23:28:33

不太清楚我現在可以如何添加代碼。我有一個相當老的Macbook Pro，所以運行舊版瀏覽器Safari 5.01和Firefox 12.0。它們似乎都沒有正常運作。 – 2014-08-29 23:35:14

我剛測試過Safari和Chrome。他們都很好。儘管如此，試着用''來包裝''。只需按「編輯」編輯您的帖子 – Idris 2014-08-29 23:38:27

你的代碼是功能性的，但是與你正在使用的AjaxUpload插件衝突。

有通過插件添加懸停類，你可以用它來APPY你的風格 - demo

變化.upload_button_on到.hover在你的CSS

.hover { 
    color:#FFFFFF; 
    background:#000; 
    text-decoration:none; 
    border-color:#000000; 
    cursor:pointer; 
}

來源

2014-08-30 00:03:26

文件上傳按鈕閃爍使用mousequery和mouseleave與Jquery

回答

相關問題