Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Bom dia, estou criando uma loja virtual em Magento onde instalei um plugin para exibir os produtos no carrinho.
A principio os produtos só eram exibidos ao clicar no carrinho, mas esta parte ja consegui resolver substitui o .click por .mouseover agora o que eu queria era que ouvesse um delay antes de sumir quando a pessoa retirar o mouse(.mouseout) uma vez que não esta permitindo nem sequer clicar dentro da janela que se abre
Originalmente o código era:
var $j = jQuery.noConflict();
$j(document).ready(function(){
//Hide (Collapse) the toggle containers on load
$j(".toggle_container").hide();
//Switch the "Open" and "Close" state per click then slide up/down (depending on open/close state)
$j("span.trigger").click(function(){
$j(this).toggleClass("active").next().slideToggle("slow");
return false; //Prevent the browser jump to the link anchor
});
});
Agora está:
var $j = jQuery.noConflict();
$j(document).ready(function(){
//Hide (Collapse) the toggle containers on load
$j(".toggle_container").hide();
//Switch the "Open" and "Close" state per click then slide up/down (depending on open/close state)
$j("span.trigger").mouseover(function(){
$j(this).toggleClass("active").next().slideToggle("slow");
return false; //Prevent the browser jump to the link anchor
});
$j("span.trigger").mouseout(function(){
$j(this).toggleClass("inactive",5000).next().slideToggle("slow");
return false; //Prevent the browser jump to the link anchor
});
});
O site é www.sofaecasa.com.br
Olá William agradeço pela resposta, mas depois de tanto procurar por uma solução acabei encontrando em um ´site em inglês alguém que tinha postado a solução para exatamente o mesmo caso com o mesmo plugin e etc...
Ficou assim:
var $j = jQuery.noConflict();
$j(document).ready(function(){
// Hide (Collapse) the toggle containers on load
$j(".toggle_container").hide();
// Switch the "Open" and "Close" state per hover action then slide up/down (depending on open/close state)
/* $j("span.trigger").click(function(){
$j(this).toggleClass("active").next().slideToggle("slow");
return false; // Prevent the browser jump to the link anchor
}); */
/**
* Custom jQuery script to handle hovers on cartdrop extension
* @author Dennis Thompson AtomicPages LLC <[http://www.atomicpages.net/>](http://www.atomicpages.net/)
* @copyright AtomicPages LLC
* @license MIT <[http://opensource.org/licenses/mit-license.php/>](http://opensource.org/licenses/mit-license.php/)
*/
var height = $j('.toggle_container').height();
$j('.cartdrop').hover(
function() {
$j('.toggle_container').addClass('open');
$j('.toggle_container').css('height', height); // set the height
$j('.toggle_container').stop().slideDown(300);
},
function() {
$j('.toggle_container').removeClass('open');
$j('.toggle_container').stop().slideUp(300);
$j('.toggle_container').promise().done(function() { // let's wait until the animation is complete
$j('.toggle_container').css('height', 0); // when animation is done set height to 0
});
}
);
});
e Funcionou perfeitamente, mais uma vez obrigado pela atenção!!!
Vc já tentou utilizar o mouseleave no lugar do mouseout ?