JavaScriptでポインタヘルプ
公開日:
:
最終更新日:2014/01/30
JavaScript
記事内に広告を含む場合があります。記事内で紹介する商品を購入することで、当サイトに売り上げの一部が還元されることがあります。
JavaScriptでポインタヘルプを作ってみました。
var helpBox, helpText, posX = 10, posY = 10;
var offsetX = 50, offsetY = -5;
var texts = ["フォトアルバム","セキュリティ小テスト","10daysJS","?"];
function setElement(){
if(document.getElementById){
helpBox = document.getElementById("box");
helpText = document.getElementById("text");
}else{
alert("このページはDOM準拠のブラウザでご覧下さい。");
}
}
function setPosition(e){
if(document.getElementById && helpBox){
posX = (e.clientX + posX * 9) / 10;
posY = (e.clientY + posY * 9) / 10;
helpBox.style.left = posX + offsetX + "px";
helpBox.style.top = posY + offsetY + "px";
}
}
function changeText(index){
if(document.getElementById && helpText){
helpText.innerHTML = texts[index];
}
}
関連記事
- PREV
- 10日でおぼえるJavaScript入門教室 読了
- NEXT
- ウェブ人間論読了