Как сделать изображение «всплывающим» при загрузке страницы (используя jQuery или, возможно, CSS-переходы) - PullRequest
Новая
       13

Как сделать изображение «всплывающим» при загрузке страницы (используя jQuery или, возможно, CSS-переходы)

1 голос
/ 20 сентября 2011

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

Я смотрел на CSS-переходы, но кажется, что они могут быть вызваны только: hover или другим псевдо-состоянием. Я ищу способ, которым это происходит без вмешательства пользователя. Кто-нибудь может указать мне правильное направление?

Спасибо!

Ответы [ 2 ]

0 голосов
/ 20 сентября 2011

Если я могу сделать небольшой плагин, вот мой плагин jQuery, который может быть использован для этой цели: http://odyniec.net/projects/imgzoom/

0 голосов
/ 20 сентября 2011

Посмотрите на функцию animate () в jQuery.Есть пример, аналогичный тому, что вы запрашиваете, однако он запускается через обработчик события onClick.Просто поместите код соответствующим образом: 

$(document).ready(function(){
  $("#block").animate({
    width: "70%",
    opacity: 0.4,
    marginLeft: "0.6in",
    fontSize: "3em",
    borderWidth: "10px"
  }, 1500 );
});

Чтобы добавить несколько изображений, вы можете создать массив и использовать setInterval для циклического просмотра каждого значения массива и запуска функции animate для текущего изображения на основе массива.индекс.

...