2013-03-14 87 views
1

在鼠標懸停的文本CRM上彈出一個彈出窗口。當我將鼠標懸停在文本上時,文本顏色應該改變 - 懸停時文本的顏色應該變爲紅色。懸停屬性文本不工作

我在下面提供了我的代碼。

我把懸停屬性給我的班,但它不工作。我如何解決它?

http://jsfiddle.net/a5tjG/3/embedded/result/

.cubeTextStyleCRM:hover { 
    color: red; 
} 
$('document').ready(function() { 
       window.setTimeout(function() { 
        $('.cubeCellCRM').each(function() { 
         var htmlText = $(this).attr('data-text'); 
         $(this).append('<div class="cubeTextStyleCRM">' + htmlText + '</div>'); 

         $(this).hover(

         function() { 
          $(".cubeTextStyleCRM").append("<span class='divStock'>Customer Relationship Management</span>"); 

         }, 

         function() { 
          $(this).find("span:last").remove(); 
         }); 
        }); 
       }, 600); 

      }); 

<div class="cubeCellCRM" data-text="CRM" data-caption=" 
           &lt;a style='padding-left: 40px; font-size: 14px; color: grey;' href='#' &gt;Create&lt;/a&gt; &lt;div&gt; 
           &lt;a style='padding-left: 40px; font-size: 14px; color: grey;' href='#' &gt;View/Edit&lt;/a&gt; &lt;/div&gt; 
           &lt;a style='padding-left: 40px; font-size: 14px; color: grey;' href='#' &gt;Reports&lt;/a&gt;" 
         data-image="http://intra.defie.co/images/Desktop_icons_02.07.13/CRM.png"></div> 
        </div> 
+3

在HTML中沒有'cubeTextStyleCRM'類。 – 2013-03-14 00:46:29

+0

對不起,它來自JS – user2045025 2013-03-14 03:05:58

回答

2

.cubeTextStyleCRM在你的CSS有color: #333 !important;被重寫你的顏色。只要讓它像color: #333;和你的:hover應該工作。如果由於某種原因,您無法訪問CSS的那部分,請重新編寫該規則,例如:

<style> 
.cubeTextStyleCRM { 
    color: #333; 
} 
.cubeTextStyleCRM:hover { 
    color: red; 
} 
</style>