JQuery Slides, я хочу, чтобы все открывались во все времена

Question

Так что я пытаюсь сделать это «слайд-шоу» с помощью слайдов jquery. У меня есть это прямо сейчас, чтобы изображения скользнули, когда я наводил курсор, но я хотел бы, чтобы одно из изображений всегда расширялось, если пользователь не зависает над изображением.

Вот ссылка на тестовую страницу http://www.johnnyedick.com/indexSlideUpTop.html, если вы хотите жить.

и вот JQuery я использую:

$(function() { 

       $('#box1').hover(function() { 
        $(this).stop().animate({ "width" : "530px"}, 1000); 
       }, function() { 
        $(this).stop().animate({ "width" : "100px"}, 1000); 
        }); 

        $('#box2').hover(function() { 
        $(this).stop().animate({ "width" : "530px"}, 1000); 
       }, function() { 
        $(this).stop().animate({ "width" : "100px"}, 1000); 
        }); 

        $('#box3').hover(function() { 
        $(this).stop().animate({ "width" : "530px"}, 1000); 
       }, function() { 
        $(this).stop().animate({ "width" : "100px"}, 1000); 
        }); 
      }); 

Благодаря

Answer 1

Я написал простую функцию: http://jsfiddle.net/skip405/9NVWt/2/. Наверное, это будет полезно. Я считаю, что это может быть еще более совершенным кем-то более опытным в jQuery, я просто новичок в нем

Answer 2

обновление:

$(function() { 
    $('#box1, #box2, #box3').hover(function() { 
     $(this).stop().animate({ "width" : "530px"}, 1000) 
      }, function() { 
       $(this).stop().animate({ "width" : "100px"}, 1000); 
        }).mouseleave(function(){ 
        jQuery.fx.off = true; 
         }); 

Answer 3

добавить этот код, после функции парения кода

$('#box3').css('width','530px') ; 

при переходе страницы 3rd div sho крыло нормальный размер