免费观看又色又爽又黄的小说免费_美女福利视频国产片_亚洲欧美精品_美国一级大黄大色毛片

JS實現十字坐標跟隨鼠標效果-創新互聯

本次小編給大家帶來一個JS的效果,實現根據瀏覽器的窗口大小出現十字坐標并跟隨鼠標移動的效果,還可以計算出實時的坐標數值。

創新互聯于2013年成立,是專業互聯網技術服務公司,擁有項目成都網站制作、成都做網站網站策劃,項目實施與項目整合能力。我們以讓每一個夢想脫穎而出為使命,1280元南山做網站,已為上家服務,為南山各地企業和個人服務,聯系電話:13518219792

我們先來看一下運行后的效果圖:

JS實現十字坐標跟隨鼠標效果

以下是經過小編測試后的全部代碼:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>鼠標跟隨十字JS特效代碼</title>
</head>
<body >
 <div id="html"></div>
 <script type="text/javascript">
 //
 var ox = document.createElement('div');
 var oy = document.createElement('div');
 ox.style.width = '100%';
 ox.style.height = '1px';
 ox.style.backgroundColor = '#ddd';
 ox.style.position = 'fixed';
 ox.style.left = 0;
 document.body.appendChild(ox);
 oy.style.height = '100%';
 oy.style.width = '1px';
 oy.style.backgroundColor = '#ddd';
 oy.style.position = 'fixed';
 oy.style.top = 0;
 document.body.appendChild(oy);
 document.onmousemove = function(e){
 var e = e || event;
 var x = e.pageX;
 var y = e.pageY;
 ox.style.top = y + 'px';
 oy.style.left = x + 'px';
 document.getElementById('html'). innerHTML = 'x : ' + x + '<br/>y : ' + y;
 };
 </script>
<p>更多代碼請訪問:<a  target="_blank">創新互聯成都網站設計公司</a></p>
</body>
</html>

另外有需要云服務器可以了解下創新互聯scvps.cn,海內外云服務器15元起步,三天無理由+7*72小時售后在線,公司持有idc許可證,提供“云服務器、裸金屬服務器、高防服務器、香港服務器、美國服務器、虛擬主機、免備案服務器”等云主機租用服務以及企業上云的綜合解決方案,具有“安全穩定、簡單易用、服務可用性高、性價比高”等特點與優勢,專為企業上云打造定制,能夠滿足用戶豐富、多元化的應用場景需求。

標題名稱:JS實現十字坐標跟隨鼠標效果-創新互聯
標題網址:http://m.newbst.com/article32/hcgpc.html

成都網站建設公司_創新互聯,為您提供移動網站建設、自適應網站、定制網站、云服務器、響應式網站、標簽優化

廣告

聲明:本網站發布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網站立場,如需處理請聯系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經允許不得轉載,或轉載時需注明來源: 創新互聯

商城網站建設