Как мне изменить этот код, чтобы изображение вращалось при обновлении?

Недавно я спросил, как поворачивать изображения на элементе и был представлен с этим кодом - который работал отлично:Как мне изменить этот код, чтобы изображение вращалось при обновлении?

counter = 1; 
num_images = 9; 
dir = "URL TO IMAGE DIRECTORY"; 

function rotateImage() { 
    var background_img = 'url(' + dir + '/image' + counter + '.gif)'; 

    jQuery('#fader.category').fadeOut(function() { 
     jQuery('#fader.category').css('background-image', background_img).fadeIn('slow'); 
    });  

    counter++; if (counter > num_images) counter = 1;   
} 
setInterval("rotateImage()", 25000);

Мой вопрос теперь: Как адаптировать этот же код, чтобы сделать изображения изменения на освежающий страница? Я новичок в jQuery и Javascript в целом, поэтому, если кто-то предоставляет решение, пожалуйста, объясните, как это работает, поэтому я могу узнать и, надеюсь, задать меньше вопросов позже ... Большое спасибо

источник

2010-01-25 JamieD

это всего лишь кадр в темноте

<body onload="rotateImage();">

источник

2010-01-25 00:16:11

Спасибо, чувак Я возьму этот снимок и попробую. – JamieD

Я бы порекомендовал вам использовать случайное стартовое изображение, чтобы создать иллюзию изменения на каждой странице загрузки/обновления. В противном случае вы остаетесь с записью куки последнего просматриваемого изображения и показывает следующий на странице загрузки:

Изменить первые две строки следующим образом (обратите внимание, я обратном порядке на цели):

num_images = 9; 
// Pick a random starting number 
counter = Math.ceil(Math.random() * num_images);

Конечно, существует вероятность того, что одно и то же изображение будет отображаться снова подряд подряд, но, вероятно, будет очень близко к тому, что вы хотите.

источник

2010-01-25 00:25:58

Или, как сказал бы Чарли Эппс ... «нет такой вещи, как действительно случайное число» ... jk –

@rockinthesixstring Ха-ха ... Я должен был дать код для использования JSONP для извлечения случайного числа из случайного числа радиоактивных распадов number service :) –

HAHAH да, я думаю, это было бы уместно, поскольку я собираюсь использовать сценарий на сайте под названием IAMANATOM !!! – JamieD

Вот простой подход к иллюстрации концепции, которая может быть адаптирована к тому, что вы хотите. Поместите это в заголовок страницы:

<?php global $banner_id; ?> 
<?php $banner_id=rand(0,N); ?> 
<style type="text/css"> 
    #header_image { 
    background: #000000 url("/path_to_image_files/image_<?php echo($banner_id); ?>.jpg") top center no-repeat; 
    } 
</style>

Здесь $ banner_id = rand (0, N); захватывает случайное число от нуля до N. Вы, конечно, вставляете свой путь к изображениям, которые хотите рандомизировать, а затем в этом случае должна быть папка с изображениями с надписью «image_N.jpg», где N рандомизировано, как ожидалось. Кроме того, необходимо будет включить это объявить глобальную переменную, чтобы получить его позже:

<?php global $banner_id; ?>

Тогда внутри тела вашей страницы просто использовать это Див, где вы хотите, чтобы случайное изображение.

<div id="header_image">

источник

2010-01-25 00:28:19 Alex

Спасибо, ребята, из рандомизированных предложений определенно полезны, но я хочу придерживаться сценария, который у меня из-за прекрасного исчезновения. – JamieD

Как мне изменить этот код, чтобы изображение вращалось при обновлении?

ответ

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