画像のズーム効果、画像の一部を拡大表示｜jQuery plugin｜Ajax｜PHP & JavaScript Room
jQueryを使用して、簡単に画像にズーム効果を付ける方法が掲載されています。 使用する画像は原寸大の画像1枚。 img要素のwidth/height属性にサムネイル表示時のサイズを指定しておきます。 サムネイル画像にマウスがのった時に、画像をサムネイル表示時よりCSSで画像サイズを25%大きくするアニメーションを行い、z-indexをあげて他の要素より上に表示するようにしています。 マウスが離れた時に、CSSで画像サイズを元のサイズに戻すアニメーションを行い、z-indexを元に戻す方法がとられています。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://w
ウィンドウの位置移動／ウィンドウサイズ・モニタサイズ取得｜Windowオブジェクト｜JavaScript/DOM｜PHP & JavaScript Room
<script type="text/javascript"> /* ウィンドウの位置移動＆ウィンドウサイズ変更（絶対指定）*/ var win; function windowOpen(){ win=window.open("","win","top=0,width=100,height=100,left=0,location=1,status=1"); } function windowMove(){ if(!win || win.closed){ alert("ウィンドウを開いてから押してください"); return false; } win.moveTo(200, 100); win.focus(); } function windowResize(){ if(!win || win.closed){ alert("ウィンドウを開いてから押してください"); return fals
要素のスクロール｜jQuery plugin｜Ajax｜PHP & JavaScript Room
リスト要素の各アイテムに指定したメッセージをMarquee風に切替表示するjQueryプラグイン。 文字を流すスタイルは上から下、下から上、左から右など、垂直・水平共にオプションで指定することができます。 初期化時、メッセージ切替前／切替時、スクロール終了時に呼ばれるコールバック関数が用意されています。 長いメッセージを垂直方向に切り替える場合は、メッセージ切り替え表示後、更に表示されたメッセージを水平方向にスクロールさせることで、長いメッセージをすべて表示させることができます。 APIが用意されているので、動的にリスト要素にアイテムを追加したり、スクロールの一時停止や再開なども簡単に実装することができます。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1
ウィンドウのアクティブ切替／自動スクロール｜Windowオブジェクト｜JavaScript/DOM｜PHP & JavaScript Room
ウィンドウのアクティブ・非アクティブ切替 常にウィンドウを最前面に表示 ウィンドウを自動スクロール〔scroll()、scrollBy()メソッド〕 なだらかにスクロールしてページの上部に戻る〔scrollTo()メソッド〕 どの位置までスクロールされているか調べる ※FF、NNのみ〔pageXoffset()、pageYoffset()メソッド〕 ウィンドウオブジェクトを格納した変数名.focus() ウィンドウオブジェクトを格納した変数名.blur() ウィンドウオブジェクトを格納した変数名.onfocus()=処理 ウィンドウオブジェクトを格納した変数名.onblur()=処理 <script type="text/javascript"> var win; function windowOpen(){ win=window.open("","win","top=0,width=1
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
設置サンプル
