Помогите с попап окном
Помогите с попап окном!
Есть код попап окна, все норм работает, вот только когда id окна состоит из двухзначного числа то перестает работать! Помогите исправить этот код! <script type="text/javascript" language="javascript"> $(document).ready(function () { $('body').append('<div id="blackout"></div>'); var boxWidth = 425; function centerBox() { /* Preliminary information */ var winWidth = $(window).width(); var winHeight = $(document).height(); var scrollPos = $(window).scrollTop(); /* auto scroll bug */ /* Calculate positions */ var disWidth = (winWidth - boxWidth) / 2 var disHeight = scrollPos + 150; /* Move stuff about */ $('.popup-box').css({ 'width': boxWidth + 'px', 'left': disWidth + 'px', 'top': disHeight + 'px' }); $('#blackout').css({ 'width': winWidth + 'px', 'height': winHeight + 'px' }); return false; } $(window).resize(centerBox); $(window).scroll(centerBox); centerBox(); $('[class*=popup-link]').click(function (e) { /* Prevent default actions */ e.preventDefault(); e.stopPropagation(); /* Get the id (the number appended to the end of the classes) */ var name = $(this).attr('class'); var id = name[name.length - 1]; var scrollPos = $(window).scrollTop(); /* Show the correct popup box, show the blackout and disable scrolling */ $('#popup-box-' + id).show(); $('#blackout').show(); /* Fixes a bug in Firefox */ $('html').scrollTop(scrollPos); }); $('[class*=popup-box]').click(function (e) { /* Stop the link working normally on click if it's linked to a popup */ e.stopPropagation(); }); $('html').click(function () { var scrollPos = $(window).scrollTop(); /* Hide the popup and blackout when clicking outside the popup */ $('[id^=popup-box-]').hide(); $('#blackout').hide(); $('html').scrollTop(scrollPos); }); }); </script> Вот html для вывода попап окна <a class="popup-link-23" alt="" title=""> Ссылка для вывода </a> <div class="popup-box" id="popup-box-23"> Сам вывод </div> Зарание примного благодарен! |
Цитата:
Как вариант. <!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery-latest.js"></script> <!-- <link rel="stylesheet" type="text/css" href="tmp.css" /> --> <style type="text/css"> .popup-box { display: none; } </style> <script type="text/javascript"> $(function () { $('body').append('<div id="blackout"></div>'); var boxWidth = 425; function centerBox() { /* Preliminary information */ var winWidth = $(window).width(); var winHeight = $(document).height(); var scrollPos = $(window).scrollTop(); /* auto scroll bug */ /* Calculate positions */ var disWidth = (winWidth - boxWidth) / 2 var disHeight = scrollPos + 150; /* Move stuff about */ $('.popup-box').css({ 'width': boxWidth + 'px', 'left': disWidth + 'px', 'top': disHeight + 'px' }); $('#blackout').css({ 'width': winWidth + 'px', 'height': winHeight + 'px' }); return false; } $(window).resize(centerBox); $(window).scroll(centerBox); centerBox(); $('[class*="popup-link"]').click(function (e) { /* Prevent default actions */ e.preventDefault(); e.stopPropagation(); /* Get the id (the number appended to the end of the classes) */ var name = $(this).attr('class'); var id = name.match(/\d+$/); /* Тут фигня var id = name[name.length - 1]; */ var scrollPos = $(window).scrollTop(); /* Show the correct popup box, show the blackout and disable scrolling */ $('#popup-box-' + id).show(); $('#blackout').show(); /* Fixes a bug in Firefox */ $('html').scrollTop(scrollPos); }); $('[class*=popup-box]').click(function (e) { /* Stop the link working normally on click if it's linked to a popup */ e.stopPropagation(); }); $('html').click(function () { var scrollPos = $(window).scrollTop(); /* Hide the popup and blackout when clicking outside the popup */ $('[id^=popup-box-]').hide(); $('#blackout').hide(); $('html').scrollTop(scrollPos); }); }); </script> </head> <body> <a class="popup-link-23" alt="" title=""> Ссылка для вывода </a> <div class="popup-box" id="popup-box-23"> Сам вывод </div> </body> </html> |
Спасибо огромное!
Спасибо огромное!
|
Часовой пояс GMT +3, время: 21:39. |