好吧,我想在任何页面周围都有大量的标题(和alt)属性。说实话,到目前为止,我已经使用SweetTitles(js库)打扮了这些,但是由于我的页面支持jQuery,我想用jQuery更快更强大。
有什么建议写入jQuery和.css以在悬停时调用标题(和alt)属性 - 而不向这些添加id?
注意:Sry我的意思是链接和图片中的title和alt属性......比如
<img src="something.jpg **alt**="This is image"> or <a href="something.php" **title**="Go to this page">
标题 =
答案 0 :(得分:3)
编辑:在您的情况下,您可能需要如下,
img[alt] { /* set style for all img tag with alt attr */ }
a[title] { /* set style for all link tag with title attr */ }
相同的逻辑适用于jQuery:
$('img[alt]') //will return all img tags with alt attribute
$('a[title]') //will return all link tags with title attribute
您需要阅读jQuery和css中的attribute selectors
。见以下链接,
我创建了一个简单的例子来向您展示如何在css和jQuery中使用属性选择器。见DEMO
<强> HTML:强>
<div title="test" ></div>
<div title="test2"></div>
<div title="test" ></div>
<div title="test2"></div>
<div title="test" ></div>
<div title="test2"></div>
<div title="test" ></div>
<div title="test2"></div>
<强> CSS:强>
div { width: 20px; height: 10px; margin: 10px; display: inline-block; }
div[title=test] { border: 1px solid red; }
div[title=test2] { border: 1px solid blue; }
<强> JS:强>
$('div[title=test]').css ('background-color', 'red');
$('div[title=test2]').css ('background-color', 'blue');
我希望它有所帮助。
答案 1 :(得分:0)
您可以尝试以下内容:
$(function() {
$("body *").each(function(e) {
if ($(this).attr("title") != undefined && $(this).attr("title") != "") {
// do work
}
if ($(this).attr("alt") != undefined && $(this).attr("alt") != "") {
// do work
}
})
})
答案 2 :(得分:0)
假设您有一个带标题的段落。
在css中你可以:
p[title='something']:hover{
//my css rules here
}
或者使用jQuery:
$("p[title='something']").hover(function(){
// my code comes here
})