Цитата:
Вот архив, там исходный код и подключенные скрипты jquery 1.8, cookies и сам скрипт для закрытия инфо-строки, но кнопка закрыть не работает, соответственно я не могу проверить будет ли работать дальше запоминание закрытия. http://файлообменник.рф/gerqokbevrg8.html или вот код:
<!DOCTYPE html>
<html><head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"><meta charset="UTF-8">
<title>Тест скрытия верхней строки</title>
<link rel="stylesheet" type="text/css" href="styles.css">
<script src="js/jquery.js"></script>
<script src="js/cookie.js"></script>
<script src="js/script.js"></script>
</head>
<body>
<div style="display: block;" id="topbar">
<div style="display: block;" class="slblock">
<div class="slider">
<div class="discount5">
При покупке в интернет-магазине скидка <b>5%</b>
</div>
</div>
</div>
<div style="" class="close"></div>
</div>
</body>
</html>
скрипт script.js:
//Избавляяемся от подсказки в верху
$('#topbar').each(function(i){
var self = this,
cookieName = 'topbar',
cookie = $.cookie(cookieName),
classes = [];
try {
classes = cookie.split(',');
} catch (e) {}
/*if (cookie !== null) {
$('> div:not(.close)', self).each(function () {
if (!in_array($(this).attr('class'), classes)) $(this).show(0).parents('#topbar').show(0);
});
}
else {
$('#topbar, #topbar > div').show(0);
}
$('.close', this).click(function(e){
e.preventDefault();
$(self).remove();
classes.push($(this).siblings().attr('class'));
$.cookie(cookieName, classes.join(), {expires: 7 * 52, path: "/"});
});*/
if (cookie !== null) {
$('.slblock .slider > div', self).each(function () {
if (in_array($(this).attr('class'), classes)) {
$(this).remove();
if ($('.slblock .slider div').length > 0) {
$('#topbar, #topbar > div').show(0);
}
else {
$(self).remove();
}
}
else{
$('#topbar, #topbar > div').show(0);
}
});
}
else {
$('#topbar, #topbar > div').show(0);
}
$('.close', this).click(function(e){
e.preventDefault();
$(this).parents('#topbar').find('.slblock .slider > div').each(function(){
if ($(this).is(':visible')){
classes.push($(this).attr('class'));
if ($(this).attr('class')=='feb23'){
$('#head .air').hide(0);
}
}
});
$(self).remove();
$.cookie(cookieName, classes.join(), {expires: 7 * 52, path: "/"});
});
//слайдер подсказки
if(($('#topbar .slider div').length > 1)/*, (cookie == null)*/) {
var n = 0,
slideName = 'slidecurrent',
cookcurrent = $.cookie(slideName);
if ($('#topbar .slider').length) {
var topslider = $('#topbar .slider').bxSlider();
var slcount = topslider.getSlideCount()-1;
n = cookcurrent;
if ((cookcurrent < slcount) && (cookcurrent != null)){
n=++cookcurrent;
}
else{
n=0
}
cookcurrent = n;
$.cookie(slideName, cookcurrent, {expires: 7 * 52, path: '/'});
var topslider = $('#topbar .slider').bxSlider({
autoControls : false,
controls : false,
pager : false,
mode : 'fade',
randomStart : false,
onSliderLoad: function () {
$('#topbar').show();
},
startSlide: n
});
}
}
if ($('#topbar .slider .feb23').is(':visible')){
$('#head .air').show(0);
}
})
/*крупные баннеры*/
$('#fridayban').each(function(i){
var self = this,
cookieName = 'fridayban_second',
cookie = $.cookie(cookieName)
if (cookie !="false") {
$(self).show();
$('#topbar').remove();
$.cookie(cookieName, "false", {expires: 7 * 52, path: "/"});
}
else{
$(self).remove();
}
$.cookie('fridayban', "", {expires: -1, path: "/"})
})
$('#grandSale').each(function(i) {
var self = this,
cookieCounter = $.cookie('disable_banner_new_seriously') || 0;
if (!cookieCounter || cookieCounter < 3) {
cookieCounter++;
// $(self).show();
$('#topbar').remove();
$.cookie('disable_banner_new_seriously', cookieCounter, { expires: 365, path: "/" });
}
$.cookie('disable_banner_new_seriously', '', { expires: -1, path: "/" });
$.cookie('disable_banner', '', { expires: -1, path: "/" });
$.cookie('disable_banner_new', '', { expires: -1, path: "/" });
});
$('#topbigtrade').each(function(i){
var self = this,
cookieName = 'topbigtrade',
cookie = $.cookie(cookieName)
if ((cookie !="false") && (cookie !="one")) {
$(self).show();
$('#topbar').remove();
$.cookie(cookieName, "one", {expires: 7 * 52, path: "/"});
}
else{
if (cookie == "one"){
$(self).show();
$('#topbar').remove();
$.cookie(cookieName, "false", {expires: 7 * 52, path: "/"});
}
else{
$(self).remove();
}
}
})
$('#usedsale').each(function(i){
var self = this,
cookieName = 'usedsale',
cookie = $.cookie(cookieName)
if (cookie !="false") {
$(self).show();
$('#topbar').remove();
$.cookie(cookieName, "false", {expires: 7 * 52, path: "/"});
}
else{
$(self).remove();
}
})
$('#kibermonday').each(function(i){
var self = this,
cookieName = 'kibersale',
cookie = $.cookie(cookieName)
if (cookie !="false") {
$(self).show();
$('#topbar').remove();
$.cookie(cookieName, "false", {expires: 7 * 52, path: "/"});
}
else{
$(self).remove();
}
})
$('#tatianaday').each(function(i){
var self = this,
cookieName = 'tatianasale',
cookie = $.cookie(cookieName)
if (cookie !="false") {
$(self).show();
$('#topbar').remove();
$.cookie(cookieName, "false", {expires: 7 * 52, path: "/"});
}
else{
$(self).remove();
}
})
|
Надо было показать html-код блоков, которые скрываются, все не надо, двух хватило бы. И вот почему:
1) Показанный блок прописан без родителя, а в JS коде "topbar" ищутся в родителях. 2) "topbar" ищутся в родителях, что может означать, что таких блоков несколько, но идентификатор, это уникальное значение и на странице он может быть только один. Слишком накладно таким образом поступать, лучше тем, что должно скрываться присвоить одно имя класса и при открытии страницы обходом в цикле проверять наличие в куках id их родителей. Для такой задачи время скрытия блоков есть понятие неоднозначное. То есть, если поступать таким образом как показано в коде, то придется устанавливать кук неимоверное количество в случае если блоков много. Наверное нужно в течении сеанса помещать выбранные блоки в одну куку, если время равно текущей дате. Если же время, это уже следующая дата (относительно текущей рабочей куки), то создавать новую куку. А может быть проще, иметь кнопку "Скрыть/Показать подсказки"? И еще раз - если $('#topbar').remove();, то проверку установленных кук выгоднее производить серверу при выдаче страницы, не выводя в нее блоки, которые нужно скрывать. |
Цитата:
Я далек от js, вообще не понимаю о чем вы пишите. Про кнопку, это сворачивание разворачивание строки с кнопкой-стрелкой и запоминание состояния? Я тоже об этом подумал, если это проще сделать, помогите плиз. |
Цитата:
Цитата:
Если кнопкой "Скрыть/Показать", то лучше запомнить этот параметр "навечно", хотя можно и длительную куку установить. Это пример, а уж по html-коду разбирайтесь сами куда его прикрепить и как, ибо что и как, и почему я так до сих пор и не знаю. В примере скрываются блоки по имени класса, будет такой один на странице, будут скрыт один, будет несколько скроется несколько.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style>
.hide {
display: none;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script>
var mem = (function() {
try {
return 'localStorage' in window && window['localStorage'] !== null ? localStorage : false
} catch(e) {
}
}());
$(function() {
var _hlp_bx = $('.help-box'), _hlp_bt = $('#help-btn').click(function(e, d) {
if(mem) {
if(mem['help'] && !d) {
mem.removeItem('help');
_hlp_bx.removeClass('hide');
_hlp_bt.text(_hlp_bt.data('mess')[1])
} else {
mem.setItem('help', 1);
_hlp_bx.addClass('hide');
_hlp_bt.text(_hlp_bt.data('mess')[0])
}
} else {
//управление через куки
}
});
if(mem && mem['help']) _hlp_bt.trigger('click', [1]);
});
</script>
</head>
<body>
<button id="help-btn" data-mess='["Показать подсказки","Скрыть подсказки"]'>Скрыть подсказки</button>
<div class="help-box">Подсказка 1</div>
<div class="help-box">Подсказка 2</div>
<div class="help-box">Подсказка 3</div>
</body>
</html>
|
| Часовой пояс GMT +3, время: 23:49. |