Javascript изменяет размер изображения через несколько секунд

0

Как изменить размер html-изображения с помощью Javascript? Я хотел бы, чтобы изображение "Pack" стало больше через 7 секунд. Вот мой код:

<html>
    <head>
        <link rel="stylesheet" href="style.css" />
    </head>

    <body>
        <!-- Pack -->
        <img id="pack" src="http://cloud.attackofthefanboy.com/wp-content/uploads/2013/07/fifa14pack.png">

        <!-- Sparkles-->
    <div id="sparkles">

        <img id="sparkle1" src="http://www.clker.com/cliparts/w/L/F/v/7/8/sparkle-md.png">

        <img id="sparkle2" src="http://www.clker.com/cliparts/w/L/F/v/7/8/sparkle-md.png">

        <img id="sparkle3" src="http://www.clker.com/cliparts/w/L/F/v/7/8/sparkle-md.png">

        <img id="sparkle4" src="http://www.clker.com/cliparts/w/L/F/v/7/8/sparkle-md.png">

        <img id="sparkle5" src="http://www.clker.com/cliparts/w/L/F/v/7/8/sparkle-md.png">

        <img id="sparkle6" src="http://www.clker.com/cliparts/w/L/F/v/7/8/sparkle-md.png">

        <img id="sparkle7" src="http://www.clker.com/cliparts/w/L/F/v/7/8/sparkle-md.png">

        <img id="sparkle8" src="http://www.clker.com/cliparts/w/L/F/v/7/8/sparkle-md.png">
        </div>
  • 0
    Вы должны показать нам, что вы пытались до сих пор. Покажите нам часть своего кода JS. Stackoverflow не для других, пишущих код для вас.
Теги:
testing
image

3 ответа

1

Вы можете зарегистрировать функцию тайм-аута, чтобы изменить стили элементов через 7 секунд следующим образом:

setTimeout(function(){
    var pack = document.getElementById("pack");
    pack.style.width = "100%;";
}, 7000);

Вероятно, вы захотите настроить его на свой вариант использования.

Поделиться
  • 0
    Спасибо. Я собираюсь редактировать расположение изображения после изменения размера, еще раз спасибо. :)
0

Это сделает трюк:

window.setTimeout(function () {
    var pack_image = document.getElementById('pack');
    if(pack_image && pack_image.style) {
        pack_image.style.height = '700px';
        pack_image.style.width = '700px';
    }
},7000);

jsFiddle этого кода

Поделиться
  • 0
    Огромное спасибо! :)
  • 0
    Знаете, как бы я отредактировал положение изображения? Я попробовал это: window.setTimeout (function () {var pack_image = document.getElementById ('pack'); if (pack_image && pack_image.style) {pack_image.style.height = '350px'; pack_image.style.width = ' 250px '; pack_image.style.top ='% 50 '; pack_image.style.left ='% 50 ';}}, 7000);
Показать ещё 5 комментариев
0

Пытаться: 

setTimeout(function(){document.getElementById("pack").style.width="soandsopx";document.getElementById("pack").style.height="soandsopx";},7000);

Где "soandsopx" - количество пикселей, которое вы хотите, плюс "px".

Поделиться
  • 0
    Это прекрасно работает, я думаю, что я собираюсь в конечном итоге использовать это. Это коротко и делает работу.
  • 0
    @Journey, спасибо!

Ещё вопросы

Сообщество Overcoder
Наверх
Меню