Модальное окно и его содержимое
Приветствую, форумчане! :) Знания языка JS у меня минимальные, могу лишь иногда интуитивно разбираться в коде, но помогает это редко :) Надеюсь, что Вы мне поможете решить возникшую проблему :)
Суть проблемы: Есть модальное окно с красивым анимированным открытием (взято на просторах интернета), в нём находится фрейм левой страницы с весомым скриптом, тут проблем в принципе нет, всё работает :) Но скрипт с фрейма жрет много ресурсов. Проблема в том, что фрейм постоянно подгружен и при загрузке основной страницы сразу начинает работать. Можно ли как то поправить скрипт модального окна, чтобы его содержимое подгружалось только при открытии самого окна и выгружалось при закрытии? Код JS прилагаю ниже, по необходимости могу скинуть CSS и HTML. jQuery(document).ready(function($){ //cache some jQuery objects var modalTrigger = $('.cd-modal-trigger'), transitionLayer = $('.cd-transition-layer'), transitionBackground = transitionLayer.children(), modalWindow = $('.cd-modal'); var frameProportion = 1.78, //png frame aspect ratio frames = transitionLayer.data('frame'), //number of png frames resize = false; //set transitionBackground dimentions setLayerDimensions(); $(window).on('resize', function(){ if( !resize ) { resize = true; (!window.requestAnimationFrame) ? setTimeout(setLayerDimensions, 300) : window.requestAnimationFrame(setLayerDimensions); } }); //open modal window modalTrigger.on('click', function(event){ event.preventDefault(); var modalId = $(event.target).attr('href'); transitionLayer.addClass('visible opening'); var delay = ( $('.no-cssanimations').length > 0 ) ? 0 : 800; setTimeout(function(){ modalWindow.filter(modalId).addClass('visible'); transitionLayer.removeClass('opening'); }, delay); }); //close modal window modalWindow.on('click', '.modal-close', function(event){ event.preventDefault(); transitionLayer.addClass('closing'); modalWindow.removeClass('visible'); transitionBackground.one('webkitAnimationEnd oanimationend msAnimationEnd animationend', function(){ transitionLayer.removeClass('closing opening visible'); transitionBackground.off('webkitAnimationEnd oanimationend msAnimationEnd animationend'); }); }); function setLayerDimensions() { var windowWidth = $(window).width(), windowHeight = $(window).height(), layerHeight, layerWidth; if( windowWidth/windowHeight > frameProportion ) { layerWidth = windowWidth; layerHeight = layerWidth/frameProportion; } else { layerHeight = windowHeight*1.2; layerWidth = layerHeight*frameProportion; } transitionBackground.css({ 'width': layerWidth*frames+'px', 'height': layerHeight+'px', }); resize = false; } }); Заранее благодарю за помощь! И простите мне мою наглость, редко обращаюсь на форумы, но решить проблему нужно быстро, а знаний недостаточно :) |
Часовой пояс GMT +3, время: 16:37. |