JSFiddle - React, Tailwind, and code Playground
Popup jui
by jihoon kim
HTML
<link rel="stylesheet" href="http://jui.io/lib/jui/css/ui.min.css" />
<link rel="stylesheet" href="http://jui.io/lib/jui/css/ui-jennifer.min.css" />
<script src="http://jui.io/lib/jquery-1.8.0.min.js"></script>
<script src="http://jui.io/lib/jui/js/core.min.js"></script>
<script src="http://jui.io/lib/jui/js/ui.min.js"></script>
<script>
jui.ready([ "ui.modal" ], function(modal) {
// 모달 (글로벌)
modal_1 = modal("#modal_1", {
color: "black"
});
// 모달 (이너)
modal_2 = modal("#modal_2_msg", {
target: "#modal_2",
opacity: 0.5,
color: 'white'
});
// 모달 (클론)
modal_3 = modal("#modal_3", {
opacity: 0.8,
clone: true
});
});
jui.ready([ "ui.window" ], function(win) {
win_1 = win("#win_1", {
width: 500,
height: 300,
left: "30%",
top: 200,
resize: true,
move: true
});
});
window.open = function() {
console.info(arguments);
var url = arguments[0];
var win_name = arguments[1];
var win_infos = arguments[2].split(",");
var width= 0;
var height= 0;
for (var i=0; i<win_infos.length; i++) {
var attr = win_infos[i].split("=");
var attrName = attr[0];
var attrValue = attr[0];
if (attrName=="width") {
width = attrValue;
} else if (attrName=="height") {
height = attrValue;
}
}
var iframe = document.getElementById("win_" + win_name);
iframe.src = url;
jui.ready([ "ui.window" ], function(win) {
var popup = win("#win_" + win_name, {
width: width,
height: height,
left: "30%",
top: 200,
resize: true,
move: true
});
popup.show();
});
}
window.onload = function() {
var pop1_ok = "1";
var width = "359";
var width2 = "359";
var width3 = "359";
var wheight = "389";
var wheight2 = "623";
var wheight3 = "569";
var wleft = "369";
var wleft3 = "728";
if(pop1_ok == "1"){
// if ( getCookie(...