On hover content开发者_运维百科 is being replaced, but when the mouse leaves the element I want it to change back. How would I do this?
$('.img-wrap').hover(function(){
$(this).find('h4').text('Go to site');
});
You need to store the original text in $.data
in the first callback, then read it in the second callback.
For example:
$('.img-wrap').hover(function(){
var h4 = $(this).find('h4');
h4.data('oldText', h4.text()).text('Go to site');
}, function() {
$(this).find('h4').text(function() { return $.data(this, "oldText"); });
});
have a look at hover it is shortcut for the mouseenter
and mouseleave
here is an example
You have to save the text before you replace it:
$('.img-wrap').mouseenter(function(){
var $h4 = $(this).find('h4');
$(this).data("old-text", $h4.text());
$h4.text('Go to site');
}). mouseleave(function() {
var $h4 = $(this).find('h4');
$h4.text($(this).data("old-text"));
$(this).data("old-text", null);
});
Good luck!
You should check the API for the hover-function. You can do it by passing an extra function:
$('.img-wrap').hover(function(){
$(this).find('h4').text('Go to site');
},
function() {
$(this).find('h4').text('');
});
精彩评论