雑学・和歌山

メールマガジン購読の勧誘、情報商材の購入などのサイトでよく見られたホバーウィンドウ、あるいはスクロールウィンドウ（ドロップインウィンドウ）とか言われていたものです。最近はうざいのかあまり使われていないようです。

例えばこんな感じのものです。
サンプル：ホバーウィンドウスクリプト設置方法
http://stepmail.hikaku.name/technic/Drop-in.php

ユーザーにとってはこのウィンドウが大きい場合閉じないといけないので、評判が悪い。しかし、これを使うと購読率、精読率が高くなると言うことで、今でもメルマガなどの勧誘サイトではよく見受けられます。

それじゃ、 いこらブログでのホーバーウィンドウの設置方法は....

ホバーウィンドウの動作をする、JavaScriptとHTML文のソースは、以下のとおりで、これを「ブログ環境設定」ページの「カスタムプラグインの登録」に三つあるカスタムプラグインのひとつにコピーペーストするだけです。



＜SCRIPT language=JavaScript1.2＞
var ie=document.all
var dom=document.getElementById
var ns4=document.layers
var calunits=document.layers? "" : "px"
var bouncelimit=32 //(must be divisible by 8)
var direction="up"
function initbox(){
if (!dom&&!ie&&!ns4)
return
crossobj=(dom)?document.getElementById("dropin").style : ie?
document.all.dropin : document.dropin
scroll_top=(ie)? truebody().scrollTop : window.pageYOffset
crossobj.top=scroll_top-250+calunits
crossobj.visibility=(dom||ie)? "visible" : "show"
dropstart=setInterval("dropin()",50)
}
function dropin(){
scroll_top=(ie)? truebody().scrollTop : window.pageYOffset
if (parseInt(crossobj.top)＜100+scroll_top)
crossobj.top=parseInt(crossobj.top)+40+calunits
else{
clearInterval(dropstart)
bouncestart=setInterval("bouncein()",50)
}
}
function bouncein(){
crossobj.top=parseInt(crossobj.top)-bouncelimit+calunits
if (bouncelimit＜0)
bouncelimit+=8
bouncelimit=bouncelimit*-1
if (bouncelimit==0){
clearInterval(bouncestart)
}
}
function dismissbox(){
if (window.bouncestart) clearInterval(bouncestart)
crossobj.visibility="hidden"
}
function redo(){
bouncelimit=32
direction="up"
initbox()
}
function truebody(){
return (document.compatMode && document.compatMode!="BackCompat")?
document.documentElement : document.body
}
window.onload=initbox
＜/SCRIPT＞
＜!--以上がJavascriptで、以下が小さなウィンドウ --＞
＜P align=left＞＜!--webbot bot="HTMLMarkup" startspan --＞＜/P＞
＜DIV id=dropin style="LEFT: 200px; VISIBILITY: hidden; WIDTH: 200px;
POSITION: absolute; TOP: 100px; HEIGHT: 50px; BACKGROUND-COLOR:
yellow;"＞
こんにちは
＜DIV align=right＞＜A onclick="dismissbox();return false" href="#"＞
[閉じる]＜/A＞＜/DIV＞

注：お手数ですが、上記のスクリプトの＜と＞は全角ですので、コピーした後、メモ帳などにペーストして半角に訂正してください。