Запретить клики вне окна.

Тема в разделе "JavaScript", создана пользователем Obormot, 3 фев 2012.

Модераторы: ZiX
  1. Obormot

    Obormot Постоялец

    Регистр.:
    10 янв 2012
    Сообщения:
    88
    Симпатии:
    2
    Был шаблон, в нем лайт бокс окно, вызывалось так:

    Код:
    $(".project-list ul li .image a.more").click(function(){
    $("#lightbox").css("filter", "alpha(opacity=90)");
    $("#lightbox").fadeIn(300);
    $(this).parent().parent().find(".lightbox-work").fadeIn(300);
    })
    $("#lightbox, .lightbox-close").click(function(){
    $("#lightbox, .lightbox-work").fadeOut(300);
    });
    Стояла задача запрограмировать окно так, что бы его невозможно было закрыть кликом вне окна! И что бы его вообще невозможно было закрыть без авторизации!

    Код модифицировали так:

    Код:
    <script>
    $(document).ready(function() {
    $("#lightbox").css("filter", "alpha(opacity=90)");
    $("#lightbox, #loginbox-panel").fadeIn(300);
    })
    $("#lightbox-close").click(function(){
    $("#loginbox-panel").fadeOut(300);
    });
    </script>
    Получилось что окно не закрывается при клике вне окна! Ура )
    Но при клике вне окна пропадает бекгоунд, который задается в CSS для лайт бокс окна, с прозрачностью, так же когда пропадает фон, становятся активными ссылки на странице, что так же недопустимо!

    Живой пример:
    Перейти по ссылке


    Помогите подправить скрипт!
    Спасибо!

     
  2. mdss

    mdss ♖♘♗♕♔♗♘♖

    Moderator
    Регистр.:
    20 фев 2007
    Сообщения:
    1.134
    Симпатии:
    668
    у тебя в коде
    PHP:
    $("#lightbox, .lightbox-close").click(function(){
            $(
    "#lightbox, .lightbox-work").fadeOut(300);
    });
    замени на
    PHP:
    $(".lightbox-close").click(function(){
            $(
    "#lightbox, .lightbox-work").fadeOut(300);
    });
     
  3. Obormot

    Obormot Постоялец

    Регистр.:
    10 янв 2012
    Сообщения:
    88
    Симпатии:
    2
    mdss, Не выходит :(

    Я заменил в этом коде:
    Код:
    <script>
    $(document).ready(function() {
    $("#lightbox").css("filter", "alpha(opacity=90)");
    $("#lightbox, #loginbox-panel").fadeIn(300);
    })
    $("#lightbox-close").click(function(){
    $("#loginbox-panel").fadeOut(300);
    });
    </script>
    Нижнюю часть функции на которую ты указал:
    Код:
    $(".lightbox-close").click(function(){
            $("#lightbox, .lightbox-work").fadeOut(300);
    });
    На сайте выше обновленный вариант.

    Если меняю изначальный код функции окно не вылезает вовсе.
     
  4. mdss

    mdss ♖♘♗♕♔♗♘♖

    Moderator
    Регистр.:
    20 фев 2007
    Сообщения:
    1.134
    Симпатии:
    668
    залей демку на jsfiddle.net, чтобы от теории перейти к практике
     
  5. Obormot

    Obormot Постоялец

    Регистр.:
    10 янв 2012
    Сообщения:
    88
    Симпатии:
    2
    Я к сожалению не смог запустить этот скрипт окна в фрейм ворке этом, мозможно что-то не првильно делаю ибо в яве не разбираюсь вовсе.
    html - код страницы c сss понятно все,
    в окно яве скрипта вставляю:

    PHP:
    $(document).ready(function() {
    $(
    "#lightbox").css("filter""alpha(opacity=90)");
    $(
    "#lightbox, #loginbox-panel").fadeIn(300);
    })
    $(
    ".lightbox-close").click(function(){
    $(
    "#lightbox, .lightbox-work").fadeOut(300);
    });
    В "результе" скрипт не выполняется.
     
  6. pitkina

    pitkina

    Регистр.:
    1 апр 2007
    Сообщения:
    253
    Симпатии:
    176
    причина в jquery-workarounds.js
    удалить 219-221 строки

    Код:
    $(document).ready(function() {
    $("#lightbox").css("filter", "alpha(opacity=90)");
    $("#lightbox, #loginbox-panel").fadeIn(300);
    
    // $("#lightbox-close").click(function(){ $("#lightbox, #loginbox-panel").fadeOut(300); });
    });
    X закомментирована
     
    Obormot нравится это.
  7. Obormot

    Obormot Постоялец

    Регистр.:
    10 янв 2012
    Сообщения:
    88
    Симпатии:
    2
    pitkina, спасибо.
    Теперь все как над срабатывает:
    Перейти по ссылке
    Но после того как удалил эти две сточки, перестали работать вкладки, сполйлеры и т.д.
    Их нельзя оставить, они как-то на друг друге завязаны ?
    Вкладки, спойлеры здесь:
    Перейти по ссылке
     
  8. pitkina

    pitkina

    Регистр.:
    1 апр 2007
    Сообщения:
    253
    Симпатии:
    176
    220 строка. лишняя скобка
    к слову, Firebug все ошибки видит
     
    Obormot нравится это.