Po najechaniu wszystkie pozostale kolumny wygasaja, po kliknieciu aktualna kolumna rozszerza sie (po ponownym - zwija). Wszystko pieknie tylko nie dziala na 1 kolumnie. Czemu? Firebug pokazuje, ze klasa jest nadawana poprawnie. Jednak pierwsza kolumna nie przyjmuje zadnej wartosci z nadanej klasy, tak jakby byla ona pusta. Jakies pomysly? Pls help!
link:
http://janzielinski.eu/sample/
kod:
Kod
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$.fn.extendCol = function() {
$('div.col').toggle(function(){
$(this).addClass('wide');
}, function(){
$(this).removeClass('wide');
})
}
$('div.col').addClass('inactive');
$('div.col').mouseenter(function(){
$(this).removeClass('inactive');
$(this).addClass('active');
$('.inactive').stop().animate({opacity: 0.4}, 200)
});
$('div.col+.active').extendCol();
$('div.col').mouseleave(function(){
$('.inactive').stop().animate({opacity: 1}, 200)
$(this).removeClass('active');
$(this).addClass('inactive');
});
});
</script>
<script type="text/javascript">
$(document).ready(function(){
$.fn.extendCol = function() {
$('div.col').toggle(function(){
$(this).addClass('wide');
}, function(){
$(this).removeClass('wide');
})
}
$('div.col').addClass('inactive');
$('div.col').mouseenter(function(){
$(this).removeClass('inactive');
$(this).addClass('active');
$('.inactive').stop().animate({opacity: 0.4}, 200)
});
$('div.col+.active').extendCol();
$('div.col').mouseleave(function(){
$('.inactive').stop().animate({opacity: 1}, 200)
$(this).removeClass('active');
$(this).addClass('inactive');
});
});
</script>
*bump*