홈페이지 이미지 플로팅 효과 샘플 code_javascript 기술

코드 복사 코드는 다음과 같습니다. function addEvent(obj, evtType, func, cap) { cap = cap || 거짓; if (obj.addEventListener) { obj.addEventListener(evtType, func, cap); 참을 반환합니다. } else if (obj.attachEvent) { if (cap) { obj.setCapture(); 참을 반환합니다. } else { return obj.attachEvent("on" evtType, func); } } else { false를 반환합니다. } } function getPageScroll() { var xScroll, yScroll; if (self.pageXOffset) { xScroll = self.pageXOffset; } else if (document.documentElement && document.documentElement.scrollLeft) { xScroll = document.documentElement.scrollLeft; } else if (document.body) { xScroll = document.body.scrollLeft; } if (self.pageYOffset) { yScroll = self.pageYOffset; } else if (document.documentElement && document.documentElement.scrollTop) { yScroll = document.documentElement.scrollTop; } else if (document.body) { yScroll = document.body.scrollTop; } arrayPageScroll = new Array(xScroll, yScroll); arrayPageScroll을 반환합니다. } function GetPageSize() { var xScroll, yScroll; if (window.innerHeight && window.scrollMaxY) { xScroll = document.body.scrollWidth; yScroll = window.innerHeight window.scrollMaxY; } else if (document.body.scrollHeight > document.body.offsetHeight) { xScroll = document.body.scrollWidth; yScroll = document.body.scrollHeight; } else { xScroll = document.body.offsetWidth; yScroll = document.body.offsetHeight; } var windowWidth, windowHeight; if (self.innerHeight) { windowWidth = self.innerWidth; windowHeight = self.innerHeight; } else if (document.documentElement && document.documentElement.clientHeight) { windowWidth = document.documentElement.clientWidth; windowHeight = document.documentElement.clientHeight; } else if (document.body) { windowWidth = document.body.clientWidth; windowHeight = document.body.clientHeight; } if (yScroll pageHeight = windowHeight; } else { pageHeight = yScroll; } if (xScroll pageWidth = windowWidth; } else { pageWidth = xScroll; } arrayPageSize = new Array(pageWidth, pageHeight, windowWidth, windowHeight) return arrayPageSize; } var AdMoveConfig = new Object(); AdMoveConfig.IsInitialized = false; AdMoveConfig.ScrollX = 0; AdMoveConfig.ScrollY = 0; AdMoveConfig.MoveWidth = 0; AdMoveConfig.MoveHeight = 0; AdMoveConfig.Resize = function () { var winsize = GetPageSize(); AdMoveConfig.MoveWidth = winsize[2]; AdMoveConfig.MoveHeight = winsize[3]; AdMoveConfig.Scroll(); } AdMoveConfig.Scroll = function () { var Winscroll = getPageScroll(); AdMoveConfig.ScrollX = winscroll[0]; AdMoveConfig.ScrollY = winscroll[1]; } addEvent(window, "resize", AdMoveConfig.Resize); addEvent(window, "scroll", AdMoveConfig.Scroll); function AdMove(id) { if (!AdMoveConfig.IsInitialized) { AdMoveConfig.Resize(); AdMoveConfig.IsInitialized = true; } var obj = document.getElementById(id); obj.style.position = "절대"; var W = AdMoveConfig.MoveWidth - obj.offsetWidth; var H = AdMoveConfig.MoveHeight - obj.offsetHeight; var x = W * Math.random(), y = H * Math.random(); var rad = (Math.random() 1) * Math.PI / 6; var kx = Math.sin(rad), ky = Math.cos(rad); var dirx = (Math.random() var 단계 = 1; var 간격; this.SetLocation = 함수(vx, vy) { x = vx; y = vy; } this.SetDirection = 함수(vx, vy) { dirx = vx; 디리 = vy; } obj.CustomMethod = function () { obj.style.left = (x AdMoveConfig.ScrollX) "px"; obj.style.top = (y AdMoveConfig.ScrollY) "px"; rad = (Math.random() 1) * Math.PI / 6; W = AdMoveConfig.MoveWidth - obj.offsetWidth; H = AdMoveConfig.MoveHeight - obj.offsetHeight; x = x 단계 * kx * dirx; if (x if (x > W) { dirx = -1; x = W; kx = Math.sin(rad); ky = Math.cos(rad); } y = y 단계 *ky * diry; if (y if (y > H) { diry = -1; y = H; kx = Math.sin(rad); ky = Math.cos(rad); } } this.Run = function () { var Delay = 10; interval = setInterval(obj.CustomMethod, 지연); obj.onmouseover = function () {clearInterval(간격); } obj.onmouseout = function () { 간격 = setInterval(obj.CustomMethod, 지연); } } } 🎜> /close1. gif /> var ad2 = new AdMove("ad2"); ad2.Run();//여러 부동 소수점 그룹 그림이 떠 있는 끝 -->

홈페이지 이미지 플로팅 효과 샘플 code_javascript 기술

관련 기사