MooTools

[mootools]タブとFx.Slideの合わせ技

by

引き出しみたいなメニューっぽいものを作るサンプル。
※このサンプルは前バージョン（1.1.2）で書いたものなので1.2では動かないかも

実際やってみると分かるが、Fx.Slide要素にリストメニュー等をくっつけてタブっぽくさせると、
動かしたとき微妙に隙間が出来てしまう。（横方向にくっつけた場合は出来ない。）
それで色々考えた結果、position駆使すれば出来るじゃない、という結論が出た。

続きを読む

[JS]設定した期間だけNEWを表示する

by

新着記事にNEWをつけたりする感じのもののサンプル。
PHPで書いたやつをJavascriptで書いてみる。

function Mark(){
	var date ="2008/04/01";//ログの年月日
	var interval ="4" //表示期限
	a = new Date();
	b = Date.parse(date)+ (parseInt(interval) * 24 * 3600 * 1000);
	c = a.getTime();
	if(b>=c) document.write("New");
	else document.write("Old");
}

続きを読む

[JS]Javascriptの有効・無効でCSSを変更する

by

javascriptが無効の時、有効で使ってるCSSだと表示がおかしくなる場合の回避方法について。

最近作ったサイトが、コンテンツの表示をmootoolsで動かしていて（スライドとかで）、javascript無効にすると まったく見えない状態になってしまう。
XHTMLソースを変更しているわけではないので、CSSだけ変更すれば見れる状態になる。（CSS無効でもXHTMLだからそれなりに見れる）
というわけで、javascriptの有効・無効でCSSを変更する方法についてのメモ。

続きを読む

[mootools]ボタンでスタイルシートを切り替える（Cookie使用）

by

mootoolsを使ってスタイルシートを切り替えるサンプル。
※このサンプルは前バージョン（1.1.2）で書いたものなので1.2では動かないかも

ベースのCSSをlinkさせておいて、クリックでCSSファイルを切り替えるようにする。
ボタンをクリックしたときCookieを発行し、リロードしたら記憶させたCSSファイルを読み込んで表示する。
リロードしても選択したCSSを表示する動作になるが、Cookie読み込んだりAssetしたりというJavascriptの動作分だけ、CSSが切り替わるのにタイムラグが発生する。
Assetよりｓｒｃだけ書き換えた方がいいのかも。

書き散らしたから汚い…

続きを読む

[mootools]ボタンでスタイルシートを切り替える

by

mootoolsで最近ブログに多いスタイルシート切り替えのサンプル。
※このサンプルは前バージョン（1.1.2）で書いたものなので1.2では動かないかも

スタイルの違うファイルを３種類用意し、それぞれボタンを押すと切り替わるようにするもの。
このサンプルは記憶させないので、ページを開くたびにシートがデフォルトに戻る。

続きを読む

[mootools]ＴＯＰへ戻るリンク

by

mootoolsで長いページにあると便利なＴＯＰへ戻るリンクを自動挿入するサンプル。
Ｄｒｅａｍｗｅａｖｅｒだとアセットとかテンプレートとかあるのでそっち使ってもいいけど。

※このサンプルは前バージョン（1.1.2）で書いたものなので1.2では動かないかも

続きを読む

[mootools]メールリンク自動挿入

by

直接ＨＴＭＬにメールアドレスを記載していると、ロボット収集されてスパムの標的にされてしまう。
それを防ぐ為の方法として

  • mailto:を使わない
  • メールアドレスを画像にする
  • メールアドレスの＠を別の文字にする
  • Flashテキスト（ボタン）を使う
  • Javascriptで記述

以上がよく使われる手段だろうか。
Javascriptではヘッダに記載してたらまったく意味がないので注意。

Ajaxライブラリmootoolsを使ってメールリンク自動挿入をする方法を考えてみた。

※このサンプルは前バージョン（1.1.2）で書いたものなので1.2では動かないかも

続きを読む

[mootools]パンくずリンク自動記入

by

mootoolsでいちいち面倒くさいパンクズリンクを自動挿入するサンプル。
※このサンプルは前バージョン（1.1.2）で書いたものなので1.2では動かないかも

でもこれだとＨＴＭＬソースにはリンクやテキストが書き込まれないから、ＳＥＯ対策という面からしたら微妙。スゴイ楽なんだけど。

続きを読む

[mootools]validな別窓リンク

by

mootoolsで別窓表示させる方法。
※このサンプルは前バージョン（1.1.2）で書いたものなので1.2では動かないかも

日本だと、別サイト＝別窓という認識が一般的なので、法人サイトなんかで別のサイトを表示させるリンクが別窓じゃないと「何でこれ別窓じゃないの？」とか言われてしまうこともしばしば。
でも別窓表示の target=”_blank”は、ＸＨＴＭＬだと非推奨要素なのでjavascriptを使う。
普通に書くと色々面倒だからmootoolsというライブラリを使用する。

続きを読む