Hi,
$('.slidingElement li').each(function(){
var bck = $(this).css('background-image');
$(this).css('background-image',bck.replace('.png','_hover.png'));
});
$('.slidingElement li').each(function(){
var bck = $(this).css('background-image');
$(this).css('background-image',bck.replace('_hover',''));
});
$('.slidingElement li a').hover(
function()
{
var $parent = $(this).parent('li');
var bck = $parent.css('background-image');
$parent.css('background-image',bck.replace('.png','_hover.png'));
$(this).animate({ width: 175+'px' }, 150);
},
function()
{
var $parent = $(this).parent('li');
var bck = $parent.css('background-image');
$parent.css('background-image',bck.replace('_hover',''));
$(this).animate({ width: 135+'px' }, 150);
});
I need the background ready to use
in the transition so I ended up with this
fake preloader
$('.slidingElement li').each(function(){
var bck = $(this).css('background-image');
$(this).css('background-image',bck.replace('.png','_hover.png'));
});
$('.slidingElement li').each(function(){
var bck = $(this).css('background-image');
$(this).css('background-image',bck.replace('_hover',''));
});
Do you have any advice ?
bck.replace(‘.png’,‘_hover.png’) a better way ?