Форум Сайтостроение Веб-строительство

Как реализовать "закрытие объекта"?

ZeN41k
На сайте с 13.09.2011
Offline
79
ZeN41k
565

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

Ну то есть, чтобы была например кнопка, на которую когда нажмешь закрывается картинка и больше не показывается. Движок DLE.

aleksandrlao
На сайте с 18.09.2009
Offline
51
aleksandrlao
#1

Посмотрите вот этот пример, наверняка, он вам подойдет: http://habrahabr.ru/post/57466/

I
На сайте с 06.08.2012
Offline
1
iNfame
#2
ZeN41k:

Ну то есть, чтобы была например кнопка, на которую когда нажмешь закрывается картинка

Ну как вариант... Не самый разумный, но я с DLE мало знаком.

Cookies устанавливаем их с помощью очень лайтовой библиотеки jquery.cookie.js (github link). 

<!DOCTYPE html>



<html lang="en">



<head>

  <title>#adv</title>

  <meta charset="utf-8">



  <style type="text/css">

    * {padding: 0; margin: 0; overflow: hidden;}

    #ad {position: relative; display: inline-block; border: solid black 1px; }

    #ad-close {position: absolute; right: 0px;}

  </style>



  <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>

  <script type="text/javascript" src="jquery.cookie.js">

  </script>

  

  <script type="text/javascript">

  $().ready(function() {



    function hide_block(id){

        $("#"+id).css("display", "none");

        return false;

    }



    if ($.cookie("ad_hide"))

    {

        hide_block("ad");

    }



    $("#ad-close-link").click(function() {

        hide_block("ad");

        $.cookie("ad_hide",'true',{expires: 9999, path: '/'});

    });



  });

  </script>

</head>



<body>

    <div id="ad">

        <div id="ad-close">

            <a href="#" id="ad-close-link">[Закрыть]</a>

        </div>

        <img src="http://img.yandex.net/i/www/logo.png" alt="ya.logo"></div>

    </div>

</body>



</html>
ZeN41k:
и больше не показывается.

Грузится страница - DIV, в нем картинка с ссылкой "закрыть".

Клик по ней обрабатывает jQuery - изменяется display на none, рекламный блок исчезает; затем устанавливаются cookies.

При каждой загрузке cookies проверяются, если нашего значения там нет - показывается рекламный блок.

PS: не люблю устанавливать куки через JS... есть еще вариант - по клику совершать AJAX-запрос к пхп-скрипту, ставящему куки, и соответствующие проверки в коде страницы с рекламным блоком, но это прицепить сложнее будет имхо.

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий