我正在使用 javascript 函数以轨道方式旋转图像。我还创建了一个弹出对话框。我想要做的是拥有它,这样当对话框处于活动状态时,即使我要从图像中鼠标移出图像也会停止。
这是我制作的javascript函数:
var popupStatus = 0;
var timer = null;
var m = {
Z : 100,
xm : 0,
xmm : .25,
ymm : 0,
ym : 0,
mx : 0,
nx : 0,
ny : 0,
nw : 0,
nh : 0,
xR : 0,
nI : 0,
scr : 0,
img : 0,
run : function () {
m.xm += (m.xmm - m.xm) * .1;
if (m.ym < m.nw * .15) m.ym++;
m.xR += m.xm;
for (var i = 0; i < m.nI; i++){
var A = (i * 360 / m.nI) + m.xR;
var x = Math.cos(A * (Math.PI / 180));
var y = Math.sin(A * (Math.PI / 180));
var a = m.img[i];
a.style.width = ''.concat(Math.round(Math.abs(y * m.ym) + y * m.Z), 'px');
a.style.left = ''.concat(Math.round((m.nw * .5) + x * ((m.nw * .5) - (m.nw * .05)) - ((Math.abs(y * m.ym) + y * m.Z) * .5)), 'px');
a.style.height = ''.concat(Math.round(m.ym + y * m.Z), 'px');
a.style.top = ''.concat(Math.round((m.nh * .5) - (m.ym * .5) - x * (m.Z * .5) - (m.ymm * y)), 'px');
a.style.zIndex = 600 + Math.round(y);
m.setOpacity(a, (y * 50) + 100);
}
timer = setTimeout(m.run, 30);
},
resize : function () {
m.nx = m.scr.offsetLeft;
m.ny = m.scr.offsetTop;
m.nw = m.scr.offsetWidth;
m.nh = m.scr.offsetHeight;
},
mousemove : function (e) {
if (window.event) e = window.event;
m.xmm = (m.nx + (m.nw * .5) - (e.x || e.clientX)) / (m.nw * .25);
m.ymm = (m.ny + (m.nh * .5) - (e.y || e.clientY)) / (m.nh * .005);
},
setOpacity : function (obj, a) {
if (a < 0) a = 0; else if (a > 100) a = 100;
if (obj.filters) obj.filters.alpha.opacity = a;
else obj.style.opacity = a / 100;
},
init : function () {
m.scr = document.getElementById("screen");
m.img = m.scr.getElementsByTagName("img");
m.nI = m.img.length;
window.onresize = m.resize;
m.resize();
m.ym = m.Z;
m.run();
}
}
function stop(){
clearTimeout(timer);
}
onload = function() {
m.init();
}
function loadPopup(){
//loads popup only if it is disabled
if(popupStatus==0){
$("#backgroundPopup").css({
"opacity": "0.7"
});
$("#backgroundPopup").fadeIn("slow");
$("#popupContact").fadeIn("slow");
popupStatus = 1;
}
();
}
function disablePopup(){
//disables popup only if it is enabled
if(popupStatus==1){
$("#backgroundPopup").fadeOut("slow");
$("#popupContact").fadeOut("slow");
popupStatus = 0;
}
}
//centering popup
function posPopup(){
//request data for centering
var windowWidth = document.documentElement.clientWidth;
var windowHeight = document.documentElement.clientHeight;
var popupHeight = $("#popupContact").height();
var popupWidth = $("#popupContact").width();
//centering
$("#popupContact").css({
"position": "absolute",
"top": windowHeight/2-popupHeight/350,
"left": windowWidth/2-popupWidth/8
});
//only need force for IE6
$("#backgroundPopup").css({
"height": windowHeight
});
}
//CONTROLLING EVENTS IN jQuery
$(document).ready(function(){
//LOADING POPUP
//Click the button event!
$("#button").click(function(){
//centering with css
posPopup();
//load popup
loadPopup();
stop();
});
});