Я пытаюсь деконструировать какой-то javascript, который я нашел для плагина лайтбокса на сайте.
Мне было любопытно, может ли кто-нибудь помочь расшифровать этот фрагмент сценария? Я хотел бы реализовать это в моем JQuery, но нужно различать, что я могу использовать то, что я не могу.
В настоящее время моя проблема заключается в том, что мой jquery позиционирования выравнивает мой div с вертикальным центром документа, как видно при начальной загрузке. Поэтому, если я прокручиваю вниз половину страницы и нажимаю на проект, чтобы открыть его, он загружает всплывающее окно относительно верхней части документа где-то в отличие от загрузки относительно центра области просмотра независимо от положения документа. Кроме того, если он слишком велик для экрана, он будет загружаться посередине, а верхняя и нижняя части будут обрезаны, и эти части не будут видны, тогда как этот найденный мной javascript будет размещать всплывающий элемент div на 10 пикселей сверху, если он слишком большой. .
Найден Javascript:
//Vertical position of div element: Either centered, or if element height larger than viewpoint height, 10px from top of viewpoint
var scroll_top=(ie)? this.standardbody.scrollTop : window.pageYOffset
var topposition=(docheight>objheight)? scroll_top+docheight/2-objheight/2+"px" : scroll_top+10+"px"
var docwidth=(ie)? this.standardbody.clientWidth : window.innerWidth-this.scrollbarwidth
var docheight=(ie)? this.standardbody.clientHeight: window.innerHeight
var docheightcomplete=(this.standardbody.offsetHeight>this.standardbody.scrollHeight)? this.standardbody.offsetHeight : this.standardbody.scrollHeight //Full scroll height of document
var objheight=divobj.offsetHeight //height of div element
divobj.style.top=Math.floor(parseInt(topposition))+"px"
Текущий Jquery, который я использую:
$(document).ready(function() {
$(".projectThumb").click(function(e){
$("#backgroundPopup").show();
htmlName = $(this).find("img").attr("name");
$("#data").load("/content/" + htmlName + ".html", null, function(){
//Set Variables
var container = $(".container");
var project = $(".project");
var popupWidth = container.find(".project img:first").width();
var popupHeight = container.find(".project img:first").height()+35;
var windowWidth = document.documentElement.clientWidth;
var windowHeight = document.documentElement.clientHeight;
//Set popup dimensions
container.css("width" , popupWidth);
container.css("height" , popupHeight);
//Set popup CSS
container.css({"position": "absolute", "background": "#000", "top": (windowHeight / 2) - (popupHeight / 2) + "px" "left": (windowWidth / 2) - (popupWidth / 2) + "px", "z-index": "2" });
project.css({"width": (popupWidth), "height": (popupHeight) });
});
});
});
Заранее спасибо!