この記事の例では、マウスの動きに追従し、閉じる関数を持つイメージ広告を js で実装する方法を説明します。皆さんの参考に共有してください。具体的な実装方法は以下の通りです。
<頭>
マウスの動きに追従し、閉じる機能を備えたイメージ広告
の間に次のコードを追加します。
<スクリプトタイプ="text/javascript">
//
関数 badAD(html){
var ad=document.body.appendChild(document.createElement('div'));
ad.style.cssText="border:1px ソリッド #000;background:#FFF;position:absolute;padding:24px 4px 4px 4px;font: 12px/1.5 verdana;";
ad.innerHTML=html||'これは悪い考えです!';
var c=ad.appendChild(document.createElement('span'));
c.innerHTML="×";
c.style.cssText="position:absolute;right:2px;top:2px;cursor:pointer";
c.onclick=function(){
document.onmousemove=null;
This.parentNode.style.left='-99999px'
};
Document.onmousemove=function (e){
e=e||window.event;
var x=e.clientX,y=e.clientY;
setTimeout(function() {
if(ad.hover)return;
ad.style.left=x 5 'px';
ad.style.top=y 5 'px';
},120)
}
ad.onmouseover=function(){
This.hover=true
};
ad.onmouseout=function(){
This.hover=false
}
}
badAD('
')
//]]>