[B! javascript] caligoのブックマーク

[JS]複数のパネルをアニメーションでスライド表示させるスクリプト -fixedTo

補助系のメニューやちょっとしたアナウンスを掲載するのに最適なパネルをアニメーションでスライド表示させるjQueryのプラグインを紹介します。 jQuery: Plugin fixedTo デモページ [ad#ad-2] デモでは、ブラウザ枠の左と下側から2枚のパネルがアニメーションでスライド表示され、表示位置はスクロールしてもブラウザの枠に対して固定位置に表示されます。デモページ fixedToの実装パネルはdiv要素を使用し、テキスト・画像・リンクなどあらゆる要素を設置可能です。 [ad#ad-2] JavaScript ﹁jquery.js﹂と﹁jquery.fixedto.min.js﹂を外部ファイルとし、下記のスクリプトを記述します。 $("elemento").fixedTo({ "posicion":"left", "ancho":360, "alto":70, "ocul

caligo 2011/03/08

《メモ》複数のパネルをアニメーションでスライド表示させるスクリプト

リンク

[JS]カスタマイズ性に優れた、メッセージのパネルを一時的に表示するスクリプト -Easy Notification

設置が簡単で、オプションも豊富に用意されカスタマイズ性にも優れた、メッセージのパネルをアニメーションで表示・非表示するjQueryのプラグインを紹介します。パネルを消去するには、﹁Close﹂ボタンをクリックします。デモは他にも二つ公開されています。デモページ‥2クリックでパネルを表示。デモページ‥3クッキー対応、初回のみパネルを表示。 Easy Notificationの特徴マークアップは非常にシンプル、しかもカスタマイズ性は強力あらゆるエレメントに設置が可能トリガーとなるイベントは、クリックやページロードなどに選択可能クッキーを使用して、一度だけ表示することも可能不必要に繰り返し表示しません。 [ad#ad-2] Easy Notificationの実装パネルのHTML パネルはシンプルなHTMLで生成されます。 <div id="easyNotificatio

caligo 2011/02/04

メッセージパネル／クッキー利用で初回のみの設定も可能

リンク

[JS]パネルをフェードや加減スクロールで切り替えるスクリプト -wSide

wSideは、パネルの切り替えにフェードや加減スクロールなど多彩なアクションを実装するスクリプトです。 wSide, plugin jquery wSideはjQueryのプラグインで、動作にはjquery.jsが必要です。切り替え時の多彩なアクションは、デモページを参照ください。シンプルデモ縦方向・横方向への加減スクロール、フェードエフェクト付きデモ反動付きスクロール、縦横斜めのスクロールアドバンスデモ CSSを利用して、さまざまな効果を狙ったパネルの切り替え

caligo 2008/02/01

いつか使えたら素敵だなぁ…って感じのスクロールで切替。使い道が思いつかない。

javascript

リンク

IDEA * IDEA

ドットインストール代表のライフハックブログ

caligo 2008/01/28

この画像をクリックすると拡大画像が見れますよ、というときに便利そうなJavaScriptのライブラリ

javascript

リンク

Lightboxスクリプトいろいろ - DesignWalker

caligo 2008/01/23

リンク

http://youmos.com/news/lightbox_effect

caligo 2008/01/23

リンク

LightBox風に角丸で可愛く画像をポップアップしてくれる「Facebox」:phpspot開発日誌

Facebox 1.0 Facebox is a jQuery-based, Facebook-style lightbox which can display images, divs, or entire remote pages. LightBox風に角丸で可愛く画像をポップアップしてくれる﹁Facebox﹂。リンクをクリックで次のように画像をポップアップしてくれます。これはFacebookでも使われているポップアップ方法のようで、知っている人は知っている、ポップアップの仕方のようです。コードは次のように非常にシンプルです。 rel="facebox" でポップアップしてくれるみたいです。 <a href="/facebox/remote.html" rel="facebox">text</a> jQueryベースなので軽量な点もうれしいところ。ちょっと気分を変えたい方は導入

caligo 2008/01/08

javascript

リンク

Portfolio > JavaScript :: Kyosuke.jp

設置方法まず、ファイル一式をダウンロードします。通常版 | prototype.js利用版 stripedtableを使いたいHTMLファイルにjavascriptを読み込みます。 <script src="js/stripedtable.js" type="text/javascript"></script> prototype.js版を使う場合は先にprototype.jsを読み込みます。 <script src="js/prototype.js" type="text/javascript"></script> <script src="js/stripedtable_proto.js" type="text/javascript"></script> テーブルに設定するクラス名や、trに対して自動的に付加されるクラス名を変える場合はstripedtable.jsの設定部分をテ

caligo 2007/12/26

table要素にclass指定するだけで、その中のtr要素に対して交互にクラス名を割り当てるスクリプト

javascript

リンク

京都大学大学院医学研究科放射線医学講座（画像診断学・核医学）

2024/05/08 NEW 研究会/勉強会を更新しました 2024/05/07 NEW 専門研修プログラムを更新しました。 2024/05/02 NEW 日本核医学会近畿支部会更新しました。 2024/04/09 NEW 研究会/勉強会を更新しました 2024/04/04 NEW 日本核医学会近畿支部会更新しました。 2024/04/04 News を更新しました。 2024/03/28 日本核医学会近畿支部会を更新しました 2024/03/18 News を更新しました。 2024/03/04 研究会/勉強会を更新しました 2024/02/14 研究に関する情報公開文書の開示を更新しました。 2024/02/01 研究会/勉強会を更新しました 2024/01/22 日本核医学会近畿支部会を更新しました。 2024/01/05 研究会/勉強会を更新しました 2023/12/21

caligo 2007/12/14

これは素晴らしい…！（※ページバックすると、スクロールで移動してた位置じゃなくてヘッダに戻るのが難点）

リンク

ソースがシンプルなJSによるロールオーバー｜CSS HappyLife

Webは略語じゃないのに﹁WEB﹂って書く人が多いのが気になって仕方ない今日この頃。︵あ、音声ブラウザを配慮したらという場合です︶さて、本題に。 CSSのみでロールオーバーするテクニックは有名でございますが、ココ最近JSでいいじゃん。と思うようになってます。ってことで、こんなサイト名ですけどJavaScriptでやるロールオーバーの方法のひとつでも。jsファイルのご用意何はともあれ、下記のjsファイルをご用意します。 function smartRollover() { if(document.getElementsByTagName) { var images = document.getElementsByTagName("img"); for(var i=0; i < images.length; i++) { if(images[i].getAttribute("src")

caligo 2007/12/14

javascript

リンク

[JS]動作が華麗でダイナミックな画像ギャラリーのスクリプト集

Interactive DOM Scriptingにエントリーされている画像ギャラリーとしても利用できるスクリプトの紹介です。どのスクリプトも、フラッシュのような華麗でダイナミックな動きを見せてくれます。

caligo 2007/12/14

　JavaScriptってすごいんだな…

javascript

リンク

MOONGIFT: » JavaScriptとCSSの融合「Dynamic CSS via JavaScript」:オープンソースを毎日紹介

JavaScriptを使ってCSSを変更というのは良くあることだ。例えばクリックで表示を消す場合やフェードアウトさせるような類のイフェクトがある。$("hoge").style.display="inline";のような指定をするだろう。しかしこれではCSSとJavaScriptの距離が遠い。もっとダイナミックにCSSを操作しよう。今回紹介するオープンソース・ソフトウェアはDynamic CSS via JavaScript、JavaScriptによるCSS操作ライブラリだ。まさにダイナミック。CSSというオブジェクトを生成し、そこにルール︵CSS指定︶を追加していくという形式で描かれる。スタイルタグを動的に生成し、描画を変化させられる。利点は何だろうか。まず、CSS上の指定を変数にまとめられるようになる。また、タグクラウドのような状態によってフォントサイズを変更するようなものを、

caligo 2007/12/07

リンク

はてなブックマーク

タグ

関連タグで絞り込む (5)

javascriptに関するcaligoのブックマーク (12)

お知らせ

今週のはてなブックマーク数ランキング（2024年7月第2週）

はてなブックマーク透明性レポート（2024年 2月-2024年4月）

今週のはてなブックマーク数ランキング（2024年7月第1週）

公式Twitter

キーボードショートカット一覧

はてなブックマーク

公式Twitter

はてなのサービス