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

Я запускаю три фотографии в функции слайд-шоу js, и мне интересно, возможно ли, чтобы первое изображение отображалось на слайд-шоу только тогда, когда сторона загружается FIRST, но не тогда, когда пользователь переходит на другие страницы сайта. Если возможно, я хотел бы, чтобы последующие загрузки страниц начинались со второго или третьего изображения в слайд-шоу.Как сделать отображение изображения при загрузке первой страницы, но не последующих нагрузках

$(document).ready(function(){ 


    $(function() { 
    setTimeout(playSlideShow, 6400); 

    function playSlideShow() { 

    var currImgContainer = $('.showImg'); 
    if (!$(currImgContainer).hasClass('lastImg')) { 
     $('.showImg').removeClass('showImg').next().addClass('showImg'); 
     setTimeout(playSlideShow, 6400); 
    } 
    if (!$(currImgContainer).hasClass('secImg')) { 
     setTimeout(playSlideShow, 4500); 
    } 
    } 
}); 
});

HTML:

<div class="slideShow" id="slideshow"> 
    <div class="showImg"> 
    <img src="img1.gif" /> 
    </div> 
    <div class="secImg"> 
    <img src="img2.gif" /> 
    </div> 
    <div class="lastImg"> 
    <img src="img3.gif"/> 
    </div> 
</div>

источник

2015-05-26 klynnftw

я бы sugest добавить печенье или с помощью LocalStorage –

также вы должны загрузить изображения через JS, его гораздо легче контролировать загрузку .. – reyaner

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

Другим вариантом является установка карусели для отображения другого изображения на основе того, на какой странице оно загружается.

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

<body data-slideNum="2"> 
    <div class="slideShow" id="slideshow"> 
    <div class="showImg"> 
     <img src="img1.gif" /> 
    </div> 
    <div class="secImg"> 
     <img src="img2.gif" /> 
    </div> 
    <div class="lastImg"> 
     <img src="img3.gif"/> 
    </div> 
    </div> 
    </body>

, вы можете написать несколько JavaScript, чтобы проверить, что атрибут на странице загрузки и установки карусельного изображение номер соответственно. Что-то вроде этого:

var startingSlide = $('body').attr('data-slideNum');

Который в этом случае установил бы «startSlide» равным «2».

источник

2015-05-26 21:41:52 jordajm

Это на самом деле дать мне идею для работы, которая, кажется, делает то, что я хочу до сих пор. Единственное ограничение заключается в том, что я не могу применить отдельный атрибут к фактическим страницам (как, например, websiteurl.com/page/2), учитывая, что это блог. Есть предположения? – klynnftw

Вам не нужно будет добавлять параметр к URL-адресу - только для любого элемента на странице, если этот элемент постоянно присутствует на каждой странице блога. У вас есть возможность добавлять атрибуты к любым элементам, например атрибуту data-slideNum, который я разместил в HTML? – jordajm

Возможно, вы можете использовать jQuery Cookie. https://github.com/carhartl/jquery-cookie

На загрузке страницы проверьте, установлен ли файл cookie, если он не отображает изображение и не устанавливает его, если он установлен, ничего не делает (при условии, что изображение по умолчанию скрыто).

Что-то вроде этого:

if($.cookie('image') == undefined) 
    $('#image').show(); 
    $.cookie('image', 'shown'); 
}

источник

2015-05-26 22:46:41 Skoua

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

ответ

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