2013-03-13 4 views
0

Несколько проблем:Расширенные окна всплывающих окон jQuery

1) Я пытаюсь сделать этот скрипт более эффективным.

2) Когда пользователь нажимает кнопку выключения, он открывает окна и скрывает элемент. (В настоящее время я использую .detach() для удаления встроенного видеопроигрывателя, потому что в Firefox .toggle() просто скрывает плеер, но сохраняет воспроизведение звука. Есть ли лучший способ сделать это?

3) Теоретически снова нажав кнопку или закрыв окно вручную, он должен скрывать или .toggle() элемент, но не для видеоплеера из-за отсоединения().

4) Если пользователь всплывает, окно вручную закрывает его, а затем снова выталкивает его, чтобы снова закрыть его, чтобы элемент не возвращался .toggle().

См. Его в действии здесь, http://www.mst3k.tv/.

$(document).ready(function() { 
    $('#lights').click(function(){$('#darkness').fadeToggle(500);}); 
    $("#lights").toggle(function(){$("#lights").attr('id','lightsoff');},function(){$("#lightsoff").attr('id','lights');}); 
    /**VIDEO**/ 
    var videoWin; 
    $('#video-toggle').click(function(){ 
     $('#video').fadeToggle(500); 
     $('#video').detach(); 
     }); 
    $('#video-toggle').click(function(){ 
     if (videoWin && !videoWin.closed) { 
     videoWin.close(); 
     return false; 
     } 
     videoWin = window.open(
     $(this).attr('rel'), 
     'videoWin', 
     'width=600,height=480,toolbar=0,top=0,left=0,menubar=0,location=0,status=0,scrollbars=0,resizable=1'); 
     return false; 
     } 
    ); 
    var watchVideo = setInterval(function() { 
     if (videoWin.closed) {clearTimeout(watchVideo);$('#video').show(500)} 
     return false; 
    }, 1); 
    /**CHAT**/ 
    var chatWin; 
    $('#chat-toggle').click(function(){ 
     $('#chat').fadeToggle(500); 
     /*$('#chat').detach();*/ 
     }); 
    $('#chat-toggle').click(function(){ 
     if (chatWin && !chatWin.closed) { 
     chatWin.close(); 
     return false; 
     } 
     chatWin = window.open(
     $(this).attr('rel'), 
     'chatWin', 
     'width=320,height=480,toolbar=0,top=0,left=601,menubar=0,location=0,status=0,scrollbars=0,resizable=1'); 
     return false; 
     } 
    ); 
    var watchChat = setInterval(function() { 
     if (chatWin.closed) {clearTimeout(watchChat);$('#chat').show(500)} 
     return false; 
    }, 1); 
    /*$("a.btn").fitText(1.2, { minFontSize: "6px", maxFontSize: "14px" });*/ 
}); 

ответ

3

Было бы лучше, если бы вы создали плагин JQuery для вашего кода, так что вы можете повторно использовать его и избежать DRY. Вот несколько вариантов:

Plugin 1: jQuery popupWindow

Plugin 2: jQuery winPop

отметить также, что closed свойство не является частью любой спецификации W3C, однако она может поддерживаться во всех браузерах.

1

Вы также можете написать функцию JS, которая может быть использована повторно. Согласно w3cschools websitewindow.closed свойство поддерживается в большинстве основных браузеров, и вы можете проверить его до запуска события.

вместо

if(videoWin && !videoWin.closed) 

можно использовать

if (typeof videoWin!='undefined'){ /* it has been created */} 
elseif(typeof videoWin='undefined') { /*it's okay to open the new window*/} 

Убедитесь, что вы не создаете переменную, если вы используете это в качестве проверки, хотя пока окно открытое мероприятие не было выпущено , Поскольку вы создаете var пару строк над объявлением функции, он всегда будет возвращаться как определено.

Вам нужно указать целевой объект в своей функции, чтобы он правильно выбрал несколько окон ... что означает, что вы не можете объявить один var для нескольких окон. Может быть, класс будет лучше.

Что-то я думал, что было странно, раньше, но забыл упомянуть, прежде чем FB отвечал мой ответ преждевременно, что вы добавляете ваш HREF в отн атрибут и указав HREF в качестве ЯШ: недействительным (0), который также нестандартный. Атрибут rel предназначен для указания связи между ссылкой и страницей ... (например, rel = nofollow). Это также может быть причиной того, что он не стреляет и не пропускает некоторое время, а также различия между ответом браузера.

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