[WP]カスタマイズ覚え書き JavaScript編

今日も懲りずにカスタム三昧。
何がしたいってのはないんだけど、とりあえず弄りたい(笑
今回のカスタマイズはWP専用ってワケじゃないのでいろいろ応用できるかも。


「このページのトップへ」ボタンの追加。
といってもただヘッダにアンカー打ってそこに飛ばしただけじゃ面白くないので加速度的にスクロールしていくようにしてみた。

<script type="text/javascript">
<!--

function pageup(e) {
UAGENT = navigator.userAgent.toUpperCase();
if (UAGENT.indexOf("MSIE") >=0) { posi = event.y; }
else { posi = e.pageY; }
moveObje(posi);
}

function moveObje(position) {
move = position / 10;
point = parseInt(position - move);
scrollTo(0,point);
if (point > 0) { setTimeout("moveObje(point)",10); }
}

// -->
</script>

こんな風にヘッダ部分にJavaScriptを埋め込んで、ページ最下部にリンクを設置するだけ。

<a href="#top" title="このページのトップへ" onclick="pageup(event);return false;">このページのトップへ</a>

外部ページへのリンクを用意する
最近の風潮で「target=”_blank”」を使わないようにってのが「HTMLページを作る上でのルール」的に言われているので、それに対応するためにこんなスクリプトを使ってみました。
このスクリプトはいつも拝見しているJETさんで使われていたものをリクエストして公開していただいたものです。JETさんありがとうございます。
どういったものかというと、指定したサーバー(ここではWPが稼働しているロリポとiBlogが置いてあるサーバー、そして自宅サーバー)以外へのリンクを探し出し、別ウィンドウで開くリンクを追加してくれるというもの。

  1. newwin.js中に初期設定(リンクURLに含まれる除外文字列など)を書く。
  2. HTMLの<head>の中に<script src=”jsのパス” type=”text/javascript”></script>でリンクする。
  3. 関数を<body onload=”newWin();”>で呼び出すか、JSファイル中にwindow.onload = function(){newWin();}と記述して呼び出す。

設置は簡単なのに見栄えもアクセシビリティも向上するとても役に立つスクリプトです。
※スクリプトは半角、パスなどはご自身の環境に合わせてに修正してご使用ください。

[WP]カスタマイズ覚え書き JavaScript編” への2件のフィードバック

  1. Kawaさん
    お久しぶりです。

    JavaScriptちゃんと動いていますね。
    実際、自分のところ以外のサイトで検証したわけではなかったので動いている姿を見てほっと一安心です。

    急遽作ったものなので、もう少し練る必要があるなと思っています。きちんとしたものが完成したときは改めて自分のサイトで公開しようと思っています。

    では、何卒よろしくお願いします。

  2. >Fsikiさん
    その節はご丁寧にありがとうございました。
    おかげさまで思い通りに表示できて大満足です。
    これからもFsikiさんのサイトではいろいろお勉強させていただきますね。よろしくお願いします。

コメントを残す