$(document).ready(function(){
// Hide all large images except the first one
$('#imageContainer img').hide().filter(':first').show();
// Select all thumb links
$('#thumbContainer a').hover(function(event) {
// Hide all large images except for the one with the same hash as our thumb link
$('#imageContainer img').hide().filter(this.hash).show();
},
function () {} // Because the hover method has a mouseout state we need to define too
);
});
This .js script works for a mouse over on an anchor tag. However, I would like this function to work on an entire div.
此.js脚本适用于锚标记上的鼠标。但是,我希望这个函数能够处理整个div。
How do I change this part : .filter(this.hash).show();
我如何更改此部分:.filter(this.hash).show();
to this : .filter(this.(id or unique name).show();
对此:.filter(this。(id或唯一名称).show();
Thank you.
Take care.
1 个解决方案
#1
If you still want to use the hash you could get it using this code (assuming that this
is your div):
如果您仍然想使用哈希,您可以使用此代码获取它(假设这是您的div):
var hash = $(this).find('a').get(0).hash;
If you want to use something unique about the div I've used the id of the div equal to the className of the img before.
如果你想使用div的独特之处,我使用的div的id等于img之前的className。
If you had this html:
如果你有这个HTML:
<div id="container1" class="thumbContainer"></div>
<div id="imageContainer">
<img src="" alt="" class="container1" />
</div>
You could use something like this, (I changed your hover to a mouseover, since you were only using that):
你可以使用这样的东西,(我把你的悬停改为鼠标悬停,因为你只使用它):
$(document).ready(function(){
// Hide all large images except the first one
$('#imageContainer img').hide().filter(':first').show();
// Select all thumb links
$('.thumbContainer').mouseover(function(event) {
// Hide all large images except for the one with the same hash as our thumb link
$('#imageContainer img').hide().filter("." + this.id).show();
}
);
});
#1
If you still want to use the hash you could get it using this code (assuming that this
is your div):
如果您仍然想使用哈希,您可以使用此代码获取它(假设这是您的div):
var hash = $(this).find('a').get(0).hash;
If you want to use something unique about the div I've used the id of the div equal to the className of the img before.
如果你想使用div的独特之处,我使用的div的id等于img之前的className。
If you had this html:
如果你有这个HTML:
<div id="container1" class="thumbContainer"></div>
<div id="imageContainer">
<img src="" alt="" class="container1" />
</div>
You could use something like this, (I changed your hover to a mouseover, since you were only using that):
你可以使用这样的东西,(我把你的悬停改为鼠标悬停,因为你只使用它):
$(document).ready(function(){
// Hide all large images except the first one
$('#imageContainer img').hide().filter(':first').show();
// Select all thumb links
$('.thumbContainer').mouseover(function(event) {
// Hide all large images except for the one with the same hash as our thumb link
$('#imageContainer img').hide().filter("." + this.id).show();
}
);
});