Am un meniu cu submeniuri generate dintr-o baza de date
Cod: Selectaţi tot
<li class="level0">
<div class="tab-title">
<span class="tab-image">
<img src="/media/categorii/lactate.png">
</span>
Categorie1
</div>
<div class="level1">
<ul>
<li>
<ul>
<div>
<li class="head-list">Subcategoria1</li>
<li><a href="#" src="http://localhost/media/cat/imagine1.jpg">Scat1</a></li>
<li><a href="#" src="http://localhost/media/cat/imagine2.jpg">Scat2</a></li>
<li><a href="#" src="http://localhost/media/cat/imagine3.jpg">Scat3</a></li>
</div>
</ul>
</li>
</ul>
<div class="ciw">
<img data-original="/media/cat/imagine1.jpg" src="http://localhost/media/cat/original.jpg" class="mainimg">
</div>
</div><!-- / .level1 -->
</li>
Cand am mouse over pe primul submeniu, in div-ul ciw se modifica img src cu src din <a>.
Daca am mouse over pe alt meniu in grupul cu subcategorii imi ramane ultima imagine din meniul deschis anterior.
Cum as putea face ca in momentul in care deschid orice meniu sa imi reseteze div-ul ciw cu valoarea din atributul data-original ?
Cod: Selectaţi tot
$j(".level0").hover(function(){
$j(this).toggleClass('hover');
});
$j(".level0 .level1 ul li ul li a").on('mouseover',function(){
imgPath = $j(this).attr('src');
i = $j('.level1 .ciw .mainimg');
i.attr('src', imgPath);
});