画像ポップアウト・イメージギャラリー・スライドショー｜jQuery plugin｜Ajax｜PHP & JavaScript Room
Lightweight Circle slideshow〔くるくる回して画像を切り替える円形のイメージギャラリー〕 Smooth Div Scroll〔水平方向に並べた画像をマウス操作でするするスクロール〕 Nivo Slider〔9種類のエフェクトがかけられるイメージスライダー〕 Galleriffic〔画像ギャラリーをリッチかつ高速にレンダリング〕 IMGPREVIEW〔マウスオーバーでリンク先の画像をプレビュー表示〕 jQuery largePhotoBox plugin〔大きな画像対応ポップアップ（マウス移動で画像全体を閲覧可能）〕 PIROBOX〔シンプルかっこいい画像ポップアップ〕 bxGallery〔シンプルな画像ギャラリー〕 A Simple jQuery Slideshow〔シンプルなスライドショー〕 Accessible News Slider〔全件表示や件数に応じて前
うっとりしてしまうデザインのシングルページWebサイト30
2017年6月29日 Webデザイン シングルページのWebサイトはあまりコンテンツがない場合・ひとつの物を強調したい場合に効果的です。Javascriptを使っておもしろい動きをつけたシングルページもたくさんあり、1ページの中にたくさんのアイデアがつまっています！ここでは世界中のWebサイトの中から美しく個性的なデザインのサイトを紹介します。次のWebサイトデザインの参考にしてみてください！ ↑私が10年以上利用している会計ソフト！ シングルページのWebサイトギャラリー pikaboo http://www.pikaboo.be/ フルFlashのサイトかと思ったらJavascriptで滑らかな動きを表現していました！必見！ Think Green Meeting http://www.thinkgreenmeeting.com/ 車と飛行機のイラストがマウスオーバーで消えていきます！
jQueryとはてなブックマークエントリー情報取得APIを使ってURLのサムネイル表示をする - voidy21の日記
サンプル http://www3.plala.or.jp/y2y/hatena_api_1/ にあります！ [必要なもの] jQuery jQuery本体をダウンロードしてきてもいいのですが、面倒なのでgoogleの提供するajaxのapiを使います。 ヘッダ(〜)に以下を追記します。 <script type="text/javascript" src="http://www.google.com/jsapi"></script> <script type="text/javascript">google.load("jquery", "1.2");</script> jQuery Tooltip plugin 1.3.0 上のリンクからjquery.tooltip_1.zipをダウンロードして以下の２つのファイルを使います。 jquery.tooltip.js jquery.toolt
bookreader.js
bookreader.jsは、長文を縦スクロールではなく、横スクロールで表示し読みやすくするJavaScriptライブラリです。 →プロジェクトのホーム (Google Code) - New!! →ダウンロード(ver 0.4.6) - 2009/04/18公開 ※ダウンロードの詳細については、こちらのページをご覧下さい。 まずは、このページで体験してみて下さい。キーボードの[→]/[←]キーが、「進む」あるいは「戻る」に対応します。画面上に表示される、半透明の▶/◀ボタンをクリックしてもOKです。使い方の詳細は「ヘルプ」を参照ください。 次期バージョンの開発状況 幸いにしてさまざまな方からフィードバックをいただきました。ありがとうございます。それを元に機能の絞り込みとWEBサイトへの「組込み方」について検討を行っています。まだ、実装の方針が定まった、という段階ですが次期0.8.x系のサ
JavaScriptでMP3を再生するライブラリの作り方
はじめに JavaScriptでMP3を再生するライブラリ「playmp3.js」の作り方を解説します。MP3の再生にはFlashの機能を利用し、JavaScriptからFlashの関数を呼び出すなど、JavaScriptとFlashの連携方法も併せて紹介します。 Flashファイルの作成には、フリーのFlashコンパイラMTASCを利用しますので、Flashを持ってない人でも応用ライブラリを作成できるでしょう。Flashと連携することでJavaScriptの可能性が広がります。 以下のサイトで、MP3再生のサンプルを試せます。 JavaScriptでMP3再生するサンプル 対象読者 JavaScriptで効果音やBGMを鳴らしてみたい人 JavaScriptとFlashを組み合わせて面白いことをやってみたい人 必要な環境 FirefoxまたはIE 6以降 フリーのFlashコンパイラ M
jQuery 日本語リファレンス
jQueryとは、JavaScriptのコーディングを強力に支援するライブラリです。 $('.semooh a').hover( function(){ $(this).text('ヌ？'); }, function(){ $(this).text('ヌー'); } );
Selectors | jQuery API Documentation
Borrowing from CSS 1–3, and then adding its own, jQuery offers a powerful set of tools for matching a set of elements in a document. To use any of the meta-characters ( such as !"#$%&'()*+,./:;<=>?@[\]^`{|}~ ) as a literal part of a name, it must be escaped with with two backslashes: \\. For example, an element with id="foo.bar", can use the selector $("#foo\\.bar"). The W3C CSS specification cont
jQuery 開発者向けメモ - リファレンス
リファレンス $() jQueryオブジェクトを作り出す関数です． $("CSS文字列") CSSで要素を指定し，マッチした要素を持つjQueryオブジェクトを返します． 詳しい指定方法は Selectors を参照してください． jquery 1.1 までは XPath による指定もできましたが，最新版では削除されています． XPath Compatibility Plugin を利用することで，1.2 でも XPath を利用可能です． var $toc_1 = $("#toc_1"); jquery_dump($toc_1); var $h1 = $("h1"); jquery_dump($h1); var $h1head = $("h1.head"); jquery_dump($h1head); var $ahref = $("a[@href^='http://jquery.com
[Javascript] JavascriptでExcelのcsvを読み込む実験 - Web制作（ホームページ制作）のソラソル株式会社（SORASOL）｜sorasolな人々
こんにちは。 Sorasolな人々のRyusuke＠デザイナーです。 初登場です。 最近の案件ではAjaxやXMLといった技術を盛り込む機会が多くなってきましたので エンジニアの手を煩わす事無くそういった機能を追加するために日々勉強をしています。 JavascriptでCSVを読み込む方法は今迄も各所で紹介されていますが、総じて以下の問題があると考えます。 S-JISのファイルを読むと文字化けをする IEやFirefox、Safariで挙動が異なる。 XMLHttpRequestにおいて特にSafariで文字化けはひどい 文字コードの変換にPerlや、PHP等と連携が必要になる 筆者は某サイトにおいて、Javascriptを使用してCSVを読み込むという機能の実装をまかされたのですが、Excelで作成したCSVファイルはSJISで記録されているため、Safariで文字化けるという問
【新春】2008年 Webデザインに使えるJavaScriptライブラリ6種【企画】
【新春】2008年 Webデザインに使えるJavaScriptライブラリ6種【企画】 ◆新春特別企画・2008年を展望する!：2008年Webデザインに使えるJavaScriptライブラリ （gihyo.jp 技術評論社） 2008年も活躍しそうなJavaScriptライブラリが6種類紹介されています。デザインをいじるものや、ユーザビリティを向上させるものが多いようです。 以下、簡単にご紹介。 ◆IE PNG Fix IE5.5以降でアルファチャンネルを含むPNG画像を表示できる → サンプル ◆curvyCorners アンチエイリアスの効いた角丸コーナーを生成する → サンプル1 | サンプル2 ◆df Javascript Smooth Scroll ページ内のスムーススクロールを実装する → 動作サンプル ◆wrapScroll ナビゲーションなどをページのスクロールに連動して動か
こだわりのページ内リンクスムーズスクロール scrollsmoothly.js
「ページ内リンク スムーズスクロール」でググればいくらでも出てくるシロモノだけど、自分の要望をすべて満たすものが無かったので作ってみた。 こだわりのページ内リンクスムーズスクロール scrollsmoothly.js 動作サンプル 以下のソースコードをサンプルページのようにhead内で読み込むだけでOK。 ソースコード(Javascript) scrollsmoothly.js 読み込み例 <script type="text/javascript" src="scrollsmoothly.js"></script> 特徴 縦横斜めにスクロール可能 スクロール中にもリンクをクリック可能 別のページからのリンクでも指定の場所までスムーズスクロールします MIT License 動作確認ブラウザ IE6, IE7 Firefox 2,3 Opera 9.27 Safari 3.1 関連エントリ
第5回 effects.js（前編）速度的なボトルネックを解消するための土台の最適化 | gihyo.jp
0105: DefaultOptions: { 0106: duration: 1.0, // seconds 0107: fps: 100, // 100= assume 66fps max. 0108: sync: false, // true for combining 0109: from: 0.0, 0110: to: 1.0, 0111: delay: 0.0, 0112: queue: 'parallel' 0113: }, 105～113行目のDefaultOptionsは、エフェクトのデフォルトのオプション設定です。 duration エフェクトの持続時間です。デフォルトは 1.0(秒)です。 fps フレームレートです。デフォルトは 100(fps)です。この値が大きいほど、動きが滑らかになります。 sync 他のエフェクトと同期するかどうかです。デフォルトはfalse
Javascript・Ajaxのテクニックとトピックのまとめ | Summary.Js
Javascript・Ajaxの注目テクニックとトピックをまとめて公開してますjQueryで実現するナビゲーションテクニック「15 Excellent jQuery Navigation Techniques and Solutions」様々なエフェクトを可能にしてくれるjQuery。その用途は幅広く、様々なシーンで使われていますが、今回紹介するのはjQueryで実現するナ... [ 詳細 ] [ 関連 ] [ ニコニコ風 ]
skuare.net
AMP（Accelerated Mobile Pages）対応におけるサイト作成と広告表示などなど 当サイトをAMP（Accelerated Mobile Pages）で構成しました。 元々別ページでAMP用ファイルを設けていましたが、スタンドアロンAMPのススメ - Mercari Engineering Blogという記事を見て、統一してしまおうと思ったのがきっかけです。
小粋空間: RSS Feed（フィード）を表示する
RSS Feed（フィード）をブログのサイドバー等に表示するテクニックです。方法は色々あるみたいですが、ここでは「Feed2JS」を利用した方法を紹介します。 Feed2JS はフリーのツールです。RSS フィードを HTML として表示させる仕組みは、まずこの Feed2JS に対し、ブログに表示したい RSS フィードのURLを入力して、それに対応する JavaScript を生成します。そしてこの JavaScript をブログに貼り付けまておきます。あとはページを表示することで、JavaScript から Feed2JS のPHPを起動し、さらにPHPのプログラムから RSS フィードを取得し、HTML に変換して表示する、という訳です。 異なるドメインのRSSも利用することができ、表示方法もきめ細かい設定が可能で、単純なテキストとして取得することも可能です。 Feed2JS はサ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
jsScrolling
http://solidstate.jp/ImageDisplay/slideshow/script_141.html
[CSS] 画像ポップアップ![[CSS] 画像ポップアップ](https://cdn-ak-scissors.b.st-hatena.com/image/square/30051d463a019e4bb580debb2d62a7b632728ea2/height=288;version=1;width=512/http%3A%2F%2Fwww.magicvox.net%2Farchive%2F2007%2F04110241%2Fcover.jpg)
Ajaxはじめの一歩 XMLHttpRequest [Javascript] All About![Ajaxはじめの一歩 XMLHttpRequest [Javascript] All About](https://cdn-ak-scissors.b.st-hatena.com/image/square/8f530daf3cb408d6b6a0ba6f38ed7ccece36cffc/height=288;version=1;width=512/https%3A%2F%2Fimg.aacdn.jp%2Faa%2Fcommon%2Fogp300_300.png)
