Показать рандомный DIV при каждой загрузке страницы
Показавыаем рандомные дивы при каждой перезагрузке страница при помощи javascript.
HTML разметка
<div id="randomdiv1" style="display: none;">
<!--Сюда можно поместить абсолютно любой контент-->
</div><!--/randomdiv1-->
<div id="randomdiv2" style="display: none;">
<!--Сюда можно поместить абсолютно любой контент-->
</div><!--/randomdiv1-->
<div id="randomdiv3" style="display: none;">
<!--Сюда можно поместить абсолютно любой контент-->
</div><!--/randomdiv1-->
<!--Сюда можно поместить абсолютно любой контент-->
</div><!--/randomdiv1-->
<div id="randomdiv2" style="display: none;">
<!--Сюда можно поместить абсолютно любой контент-->
</div><!--/randomdiv1-->
<div id="randomdiv3" style="display: none;">
<!--Сюда можно поместить абсолютно любой контент-->
</div><!--/randomdiv1-->
javascript код
<script type="text/javascript">
// Единственная строка в которой нужно делать изменения. Тут указываем используемое количество дивов, в нашем случае - это 3.
NumberOfDivsToRandomDisplay = 3;
var CookieName = 'DivRamdomValueCookie';
function DisplayRandomDiv() {
var r = Math.ceil(Math.random() * NumberOfDivsToRandomDisplay);
if(NumberOfDivsToRandomDisplay > 1) {
var ck = 0;
var cookiebegin = document.cookie.indexOf(CookieName + "=");
if(cookiebegin > -1) {
cookiebegin += 1 + CookieName.length;
cookieend = document.cookie.indexOf(";",cookiebegin);
if(cookieend < cookiebegin) { cookieend = document.cookie.length; }
ck = parseInt(document.cookie.substring(cookiebegin,cookieend));
}
while(r == ck) { r = Math.ceil(Math.random() * NumberOfDivsToRandomDisplay); }
document.cookie = CookieName + "=" + r;
}
for( var i=1; i<=NumberOfDivsToRandomDisplay; i++) {
document.getElementById("randomdiv"+i).style.display='none';
}
document.getElementById("randomdiv"+r).style.display='block';
}
DisplayRandomDiv();
</script>
// Единственная строка в которой нужно делать изменения. Тут указываем используемое количество дивов, в нашем случае - это 3.
NumberOfDivsToRandomDisplay = 3;
var CookieName = 'DivRamdomValueCookie';
function DisplayRandomDiv() {
var r = Math.ceil(Math.random() * NumberOfDivsToRandomDisplay);
if(NumberOfDivsToRandomDisplay > 1) {
var ck = 0;
var cookiebegin = document.cookie.indexOf(CookieName + "=");
if(cookiebegin > -1) {
cookiebegin += 1 + CookieName.length;
cookieend = document.cookie.indexOf(";",cookiebegin);
if(cookieend < cookiebegin) { cookieend = document.cookie.length; }
ck = parseInt(document.cookie.substring(cookiebegin,cookieend));
}
while(r == ck) { r = Math.ceil(Math.random() * NumberOfDivsToRandomDisplay); }
document.cookie = CookieName + "=" + r;
}
for( var i=1; i<=NumberOfDivsToRandomDisplay; i++) {
document.getElementById("randomdiv"+i).style.display='none';
}
document.getElementById("randomdiv"+r).style.display='block';
}
DisplayRandomDiv();
</script>
Важно! javascript код должен находиться ниже вашей HTML разметки, т.к. разметка должна прогрузиться в DOM, иначе не будет ничего работать.
В этом примере мы использовали куки, чтобы по возможности после каждой перезагрузки не показывать один и тот же див.
- Categories:
- heihachi's blog
- Add new comment
- 162 reads

Comments
скрытые дивы
скрытые дивы
плохая практика, за клоакинг
плохая практика, за клоакинг сойдет
Почему вы считаете её плохой?
Почему вы считаете её плохой?