편집토론기록

사용자:Senior9324/Gadget-ReferenceDrawerDev.js: 두 판 사이의 차이

< 사용자:Senior9324
편집 요약 없음
편집 요약 없음
1번째 줄: 1번째 줄:
function getOffset(elem) {
var offset = null;
if (elem) {
offset = {left: 0, top: 0};
do {
offset.top += elem.offsetTop;
offset.left += elem.offsetLeft;
elem = elem.offsetParent;
} while (elem);
}
return offset;
}
function showDrawer(id, name) {
function showDrawer(id, name) {
var drawer = document.getElementById("reference-drawer");
var drawer = document.getElementById("reference-drawer");
17번째 줄: 4번째 줄:
drawer.children[0].setAttribute("data-target", id);
drawer.children[0].setAttribute("data-target", id);
drawer.children[0].textContent = name;
drawer.children[0].textContent = name;
drawer.children[1].innerHTML = document.querySelector("#" + id + " > .reference-text").innerHTML;
drawer.children[1].innerHTML = $("#" + id + " > .reference-text").html();
drawer.className = "visible";
drawer.className = "visible";
}
}


//window.onload = function() {
$(document).ready(function($) {
/* create drawer */
/* create drawer */
var drawer = document.createElement("div");
drawer = $("<div></div>").attr("id", "reference-drawer");
drawer.setAttribute("id", "reference-drawer");
var origin = $("<a></a>").attr("id", "reference-origin").click(function() { $('html, body').animate({ scrollTop: ($("#" + $(this).attr("data-target")).offset().top - 60) }, 400); });
var origin = document.createElement("a");
var content = $("<span></span>").attr("id", "reference-drawer-text");
origin.setAttribute("id", "reference-origin");
drawer.append(origin);
origin.onclick = function() {
drawer.append(content);
if (jQuery) {
$(document.body).append(drawer);
$('html, body').animate({
scrollTop: ($("#" + $(this).attr("data-target")).offset().top - 60)
}, 400);
} else {
window.scrollTo(0, getOffset(document.getElementById(this.getAttribute("data-target"))).top - 60);
}
};
var content = document.createElement("span");
content.setAttribute("id", "reference-drawer-text");
drawer.appendChild(origin);
drawer.appendChild(content);
document.body.appendChild(drawer);
document.onclick = function(e) {
$(document).click(function(e) {
if (!$(event.target).closest("#reference-drawer").length) {
if (!$(event.target).closest("#reference-drawer").length) {
document.getElementById("reference-drawer").className = "";
$("#reference-drawer").removeClass("visible");
}
}
};
}).scroll(function(e) {
document.onscroll = function(e) {
$("#reference-drawer").removeClass("visible");
document.getElementById("reference-drawer").className = "";
});
};
$(".reference a").each(function() {
var refLinkList = document.querySelectorAll(".reference a");
for (var elem in refLinkList) {
if (!refLinkList.hasOwnProperty(elem)) continue;
var span = document.createElement("span");
var span = document.createElement("span");
span.className = "reference-hooker";
span.className = "reference-hooker";
span.onclick = function(e) {
span.appendChild(this.childNodes[0]);
e.preventDefault();
this.appendChild(span);
e.stopPropagation();
});
showDrawer(this.parentNode.href.split("#")[1], this.textContent);
$(".reference-hooker").click(function(e) {
};
e.preventDefault();
span.appendChild(elem.childNodes[0]);
e.stopPropagation();
elem.appendChild(span);
showDrawer(this.parentNode.href.split("#")[1], this.textContent);
}
});
//};
});

2015년 6월 3일 (수) 15:16 판

function showDrawer(id, name) {
	var drawer = document.getElementById("reference-drawer");
	drawer.children[0].href = "#" + id;
	drawer.children[0].setAttribute("data-target", id);
	drawer.children[0].textContent = name;
	drawer.children[1].innerHTML = $("#" + id + " > .reference-text").html();
	drawer.className = "visible";
}

$(document).ready(function($) {
	/* create drawer */
	drawer = $("<div></div>").attr("id", "reference-drawer");
	var origin = $("<a></a>").attr("id", "reference-origin").click(function() { $('html, body').animate({ scrollTop: ($("#" + $(this).attr("data-target")).offset().top - 60) }, 400); });
	var content = $("<span></span>").attr("id", "reference-drawer-text");
	drawer.append(origin);
	drawer.append(content);
	$(document.body).append(drawer);
	
	$(document).click(function(e) {
		if (!$(event.target).closest("#reference-drawer").length) {
			$("#reference-drawer").removeClass("visible");
		}
	}).scroll(function(e) {
		$("#reference-drawer").removeClass("visible");
	});
	$(".reference a").each(function() {
		var span = document.createElement("span");
		span.className = "reference-hooker";
		span.appendChild(this.childNodes[0]);
		this.appendChild(span);
	});
	$(".reference-hooker").click(function(e) {
		e.preventDefault();
		e.stopPropagation();
		showDrawer(this.parentNode.href.split("#")[1], this.textContent);
	});
});