2009-08-20 5 views
1

Его довольно просто, чтобы увидеть, что я имею в виду, если вы посмотрите на изображение, которое я также должен сжиматься, если нажать ее снова, она должна быть анимированы, а также:Увеличить размер изображения нажмите

The image link http://www.keironlowecreative.x10hosting.com/Help.png

+0

Err ... какой прикрепленный образ? – VoteyDisciple

+0

Я не знаю, что случилось, ссылка есть сейчас в любом случае –

+0

Вы хотите, чтобы это было анимировано? Если это так, есть команда $ .animate, которую вы можете настроить для этого. –

ответ

1

JQuery

$(document).ready(function(){   
    $("#what > img").click(function() { 
     $("img").toggle("slow"); 
    });  
}); 

HTML

<div id="what"> 
    <img src="small_img" /> 
    <img src="big_img" style="display: none" /> 
</div> 

toggle

+0

Это работает любопытное право, за исключением того, что мне нужно, чтобы он был анимированным, и когда я нажимаю на него, изображение логотипа исчезает –

+0

, кстати, я не имею в виду, что я не буду ловить логотип, Я имею в виду, что он исчезает –

+0

. Переключатель («медленный») должен анимировать, посмотрите примеры, приведенные в ссылке. первый исчезает, появляется второй, не так ли? маленькое изображение переключается с большим изображением. – zalew

0

Извините инлайн стили ... пикселы не точны. Используйте один и тот же образ дважды, один DIV поверх другого:

<div id="wrapper" style="position:relative; height:20px;"> 
    <div id="top" style="background:url(...) top left no-repeat; position:absolute; height: 20px; width:18px; top:0; left:0; z-index:2;"></div> 
    <div id="under" style="background:url(...) top right no-repeat; position:absolute; height:20px; width:20px; top:0; left:2px; z-index:1;"></div> 
</div> 

Так верхний ДИВ показывает плюс и левый угол. Нижний div показывает правый угол - более двух пикселей, поэтому он не отображается под углами верхнего элемента. Если изображение непрозрачное, это не имеет значения ...

Анимация ширины нижнего div, чтобы получить эффект. Нет затухания, только одно изображение. Должно быть маленьким и быстрым для оживления.

+0

Я не могу заставить это работать, я ввел стили в css, и он не работает. –

Смежные вопросы