获取具有鼠标的元素的属性

我正在试图制作一个图例系统到我的网站..这是一个简单的任务... 当鼠标移到元素上时，jquery获取value属性并增加了此值低于div ...获取具有鼠标的元素的属性

我不知道如何获取属性，因为选择返回3元...... 这里是代码..

$(function(){ 
$('#legends .item') 
    .mouseover(function(){ 
      $('#legend-tags').html($('#tag-video').attr("value")).fadeIn(); 
     }) 
    .mouseout(function(){ 
      $('#legend-tags').fadeOut(); 
     }); 
});

这选择返回3个元素，我想要获取鼠标移到mome中的元素的属性NT。在这个测试代码中，我得到了#tag-video的属性，这是其中一个要素。

这里的HTML：

<div id="legends"> 
    <span>TAGS</span> 
    <div id="tag-motion" class="item tag-motion" value="motion"></div> 
    <div id="tag-design" class="item tag-design" value="design"></div> 
    <div id="tag-video" class="item tag-video" value="video"></div> 
    <div id="legend-tags">legend</div>     
</div>

这里是CSS：

#legends .item 
{ 
    display: block; 
    width: 27px; 
    height: 27px; 
    cursor: pointer; 
    margin-bottom: 5px;  
} 

#legend-tags 
{ 
    display: none; 
} 

.tag-video 
{ 
    background-image: url('../img/tag-video.svg'); 
} 

.tag-video:hover 
{ 
    background-image: url('../img/tag-video-over.svg'); 
} 

.tag-design 
{ 
    background-image: url('../img/tag-design.svg'); 
} 

.tag-design:hover 
{ 
    background-image: url('../img/tag-design-over.svg'); 
} 

.tag-motion 
{ 
    background-image: url('../img/tag-motion.svg'); 
} 

.tag-motion:hover 
{ 
    background-image: url('../img/tag-motion-over.svg'); 
}

来源

2013-03-29 carmolim

你还必须在JavaScript和CSS，项目VS ITEN –

您需要使用

$('#legend-tags').html($(this).attr("value")).fadeIn();

演示：Fiddle

在你的情况硬编码$('#tag-video')而不是您需要获取鼠标悬停的元素，该元素在悬停回调中可用，如this变量。

注：有一个在你的选择$('#legends .iten')类型应该是$('#legends .item')

来源

2013-03-29 02:17:05

我认为，在这种情况下，回调将指向＃传说标签不选择......在那里我可以更多地了解一个拼写错误？ – carmolim

当鼠标移过树项目时，鼠标快速移动，动画继续运行，我试图放置一个.stop（），但是元素永远不会完全淡入或淡出...... – carmolim

会是这样的工作？

$("div.item").hover(function(){ 
    $('#legend-tags').html($(this).attr("value")).fadeIn(); 
});

来源

2013-03-29 02:20:36 cmallard

获取具有鼠标的元素的属性

回答

相关问题