var imageBlockWidth = 320; $(document).ready(function () { $('.praca>a').mouseover(function (event) { var workDiv = $(event.target).parent().parent(); workDiv.find('#info').show(); var blocksByDiv = ( $('#content').width() - ( $('#content').width() % imageBlockWidth ) ) / imageBlockWidth; var indexInRow = ($('#content>.praca').index(workDiv)+2) % blocksByDiv; console.log(indexInRow); console.log($('#content>.praca').index(workDiv), $('#content>.praca').children().size()/2); if ( $('#content>div').index(workDiv) != 0 && indexInRow == 0 || $('#content>div').index(workDiv) == $('#content>.praca').children().size()/2) { workDiv.find('#info').css('margin-left', '-'+ imageBlockWidth +'px'); } else { workDiv.find('#info').css('margin-left', imageBlockWidth +'px'); } }); $('.praca>a').mouseleave(function (event) { $(this).parent().parent().find('#info').hide(); }); });
Chodzi głównie o nadanie odpowiednich css.
W jaki sposób można to 'naprawić'?