【BearFactory】さよなら IE6 さん。こんにちは IE8 ちゃん。
こんにちは、フェンリル Web 担当の青野です！ 今回は Internet Explorer 6 を使ってるユーザーに Internet Explorer 8 を推進して使ってもらおう！ということでライブラリを作りました! その名も「UPIE8Kuma.js」です。 ライブラリは下記のページから設置方法を確認をすことができます。 【BearFactory | インターネットエクスプローラー 8 推進スクリプト配布ページ】 http://www.bearfactory.jp/labs/upie8kuma/upie8kumajs.html ※ このライブラリは Internet Explorer 6 ユーザーを対象に作成しているため Internet Explorer 6 以外では動きませんが、このページではご覧の通り Internet Explorer 6 以外（Internet Explo
[JS]アニメーションのエフェクトを加えるJavaScriptのフレームワーク集
ちょっとした動きから、ダイナミックな動きまでアニメーションのエフェクトを加えるJavaScriptのフレームワークをSix Revisionsから紹介します。 10 Impressive JavaScript Animation Frameworks
[JS]外部スクリプトの読み込みをコントロールするスクリプト -LABjs
LABjs (Loading And Blocking JavaScript) 「LAB」は「Loading and Blocking」の略で、JavaScriptのロードとブロックをコントロールします。 使用方法はキャプチャのように、最初に読み込ませたいスクリプト（jquery.js）、そのスクリプトを読み込んでから読み込ませたいスクリプト（jquery.ui.js, myplugin.jquery.js）、そして最後に読み込ませたいスクリプト（initpage.js）を順番に読み込ませることができます。 外部スクリプトのタイミングは複雑に設定することが可能で、個別にsec, type, languageを指定することもできます。 サンプルは下記ページを参照ください。 LABjs: Example
JavaScriptによって動的にアンチエイリアス化＆選択してコピーも可能な仕組み「TypeSelect」:phpspot開発日誌
JavaScriptによって動的にアンチエイリアス化＆選択してコピーも可能な仕組み「TypeSelect」 2009年07月13日- TypeSelect - Javascript-based Selectable Typefaces JavaScriptによって動的にアンチエイリアス化＆選択してコピーも可能な仕組み「TypeSelect」のご紹介。 以前、JavaScript を使い、Canvasを使ってアンチエイリアスがかかった綺麗な文字にする typeface.js という仕組み紹介しました。 これにより、文字は簡単に綺麗になったのですが、テキストのコピーペーストが出来ないという問題がありました。 選択してコピーしても文字にはならない。 TypeSelect なら、１文字ごとに選択することが可能で、コピーすることも出来ます。 綺麗にレンダリングされた文字を選択している図 内部的にはt
JooseでロールオーバーのJavascript書いてみた - Webtech Walker
takazudoさんのJavascriptのオブジェクト指向の記事、わかりやすくていいですねー。僕も便乗してJavascriptのオブジェクト指向について書いてみます。 今回はJooseでロールオーバーのスクリプト書いてみました。Jooseというのはperlのオブジェクト指向システムのMooseをJavascript版に移植したライブラリです。 joose-js - Google Code 設計する まずどういう機能を持たせたいかを決めます。 マウスオーバーしとたとき指定した接尾語を後ろに付けた画像のパスに切り替わる マウスアウトしたとき元画像のパスに切り替わる ロールオーバーしたい要素を渡すと1、2のイベントを付加する 付加したイベントを削除できる ロールオーバー画像をプリロードできる 初期化したときにしたときに1と4を実行する ここからロールオーバークラスに必要そうな属性（プロパティ）
一工夫でページのクオリティをアップするCSSとJavaScriptのソリューション集
Silverback Giveaway 一見、背景画像をCSSかJavaScriptで配置したように見えますが、CSSで普通に配置されたソリューションです。 テキストやリストが画像に重ならないように、marginを設定します。 HTML <textarea name="code" class="html" cols="60" rows="5"> <h3>Contest Details</h3> <div class="imagery""> <img src="imagery.png" width="205" height="400" alt="Imagery" /> </div> <p>...the introductory paragraph...</p> <ol> <li>...various bullet points went here...</li> </ol> </textar
JavaScriptツール&ライブラリ50選 | エンタープライズ | マイコミジャーナル
Smashing Magazine - WE SMASH YOU WITH THE INFORMATION THAT WILL MAKE YOUR LIFE EASIER, REALLY. Smashing Editoria氏がSmashing Magazineにおいて50 Fresh JavaScript Tools That Will Improve Your Workflowのタイトルで50のJavaScriptに関連したツールやライブラリを紹介している(実際には51)。RIA開発においてJavaScriptは重要な地位を占めつつあり、適切な開発ツールやライブラリ、フレームワーク、プラグインを選択することは、迅速で効果的な開発を実現するために欠かせない。紹介されているツールやライブラリは次のとおり。 JavaScriptツール FireUnit (Firebug向けJavaScrip
prototype.jsベースの凄いビジュアルエフェクト＆ＵＩ作成用JavaScriptフレームワーク「scripty2」:phpspot開発日誌
prototype.jsベースの凄いビジュアルエフェクト＆ＵＩ作成用JavaScriptフレームワーク「scripty2」 2009年06月29日- scripty2: for a more delicious web prototype.jsベースの超絶ビジュアルエフェクト＆ＵＩ作成用JavaScriptフレームワーク「scripty2」が公開。 jQueryではなく、prototype.jsベースになっていて、まだまだprototype.js も負けていない、という感じでしょうか。 デモとして、カードをアニメーションさせるものや、パズルが公開されています。 カードが面白く動くサンプル アニメーションするパズルのサンプル API リファレンスはこちら jQuery でも同様のものが出てきそうですが、互いのフレームワークで競い合い、より沢山のことが出来ていっているという意味ではよいことかも
text shadow box - zachstronaut
text shadow box, June 2009 Move your cursor over the box to cast a shadow with the spotlight. This demo uses the CSS property text-shadow, supported in Safari, Firefox 3.5, Opera, and Chrome. Also check out my more sophisticated example that replaces the PNG spotlight with one generated by a CSS radial gradient and also casts a proper shadow for the ledge. Created by Zachary Johnson. Please check
20+ Ready to Use Auto Completion Scripts |Dzine Blog
Auto Completion has become one of the coolest user interaction element in websites lately and most of the famous sites from google, youtube to msn have auto completion based search boxes.so this time i’ve Collected 20+ Ready to Use Auto Completion Scripts vary from CSS,Ajax based, mootools and jQuery with cool Animation . which you can easily incorporate into your future designs. Hope you like the
[JS]インタラクティブなインターフェイスを実装するJavaScriptのライブラリ -Glow | コリス
インタラクティブなタイムテーブルのUIなどを実装するJavaScriptのライブラリ「Glow」を紹介します。
[JS]テキストや背景のカラーをアニメーションで変更するスクリプト -Color Animations
テキストや背景のカラーをアニメーションで少しずつ変更するスクリプトをDesizn Techから紹介します。 Playing with jQuery Color Plugin and Color Animation demo デモでは、テキストのカラーを変更するもの、背景を変更するもの、それぞれ異なるカラーに変更するものなどがあります。 テキストのカラーを変更する場合は、下記のように指定します。 <textarea name="code" class="html" cols="60" rows="5"> $(".first a").hover(function() { $(this).animate({color: "#00eeff" }, 400); },function() { $(this).animate({color: "#FFFFFF" }, 500); }); </textar
[JS]テーブル内のコンテンツをセル間で移動可能にするスクリプト
Drag and drop table content with JavaScript demo デモではテーブル内のコンテンツをドラッグ&ドロップでセル間の移動が可能で、配置したコンテンツの量でセルの高さも変更します。 スクリプトはjQueryなど他のスクリプトに依存せず単体で動作するもので、対応ブラウザはIE6をはじめFx3にも対応しています。
古いブラウザでもCSS3セレクタを使ってWebページをデザインできるようにしてみた - latest log
uuCSSBoost.js は uuAltCSS.js に名前が変更になりましたが、一部の説明が記事を書いた当時の古い名前のままになっています。最新版では、uuCSSBoost.revalidate() は廃止され uuAltCSS() を呼び出すように変更になっています。 コードの解説を追記しました。 「最新の規格を実装したブラウザが登場しても、IE6 のせいで諦めるしかないのか」 「CSS3セレクタを古いブラウザでも使いたい!」 といった現場の声にお応えして、ほぼ全てのブラウザで CSS3 セレクタを利用したページデザインが可能になるJavaScript ライブラリを作ってみました。 特徴 軽いよ いろんなブラウザで動くよ(Firefox2+, Opera9.2x+, Safari3+, IE6+, Google Chrome1+) 95%〜98%ぐらいのシェアをカバーできるんじゃない
JavaScriptで複雑なデータ視覚化のためのライブラリ「JavaScript InfoVis Toolkit」:phpspot開発日誌
JavaScript InfoVis Toolkit - Interactive Data Visualizations for the Web JavaScriptで複雑なデータ視覚化のためのライブラリ「JavaScript InfoVis Toolkit」 次のような、画像編集ツールで書くにしても大変そうな複雑なデータの描画をJavaScriptで行えます。 描画できるグラフもなかなかユニークなものが多くて、これは覚えておくといつか使えるかもしれません。 APIドキュメントはこちら 関連エントリ 複雑なデータも綺麗に描画できるデータのビジュアライズフレームワーク「Axiis」 データを視覚的に分かりやすくビジュアライズするためのライブラリ集
JavaScriptで画像のリンク切れをチェックする方法:phpspot開発日誌
JavaScript で、画像本来のサイズ(幅, 高さ)を取得する方法 - latest log JavaScriptで画像のサイズ(幅,高さ)をとる方法があって詳しく紹介されていて分かりやすいです。 ここで、画像のリンク切れをチェックする方法が書かれていなかったので書いてみます。 var img = new Image(); var url = '//phpspot.org/blog/img/notfound.jpg'; // あえて存在しない画像を指定 img.onload = function() { alert('width='+img.width+' , height='+img.height); }; img.onerror = function() { alert(url+' is dead'); }; img.src = url; 赤文字の部分を記述しておけば、エラー時に
javaScriptでフォントサイズを変更する（クッキー付き） | チバのブログ
ｊQueryを使ったフォントサイズ変更用のスクリプトのソースを紹介します。 これを使えばページのリロードなしに、ページ内のフォントサイズを変更することができるようになります。また、変更後の大きさをクッキーに保存するので、ページ遷移後もフォントサイズの大きさは変わりません。 このスクリプトを作るにあたって、フォントサイズ変更のスクリプトをいろいろと見て回ったのですが、クリックによって<link>要素を書き換えて読み込むCSS自体を変更する、というスクリプトがほとんどでした。 それだと、なんか面倒くさそうだったので、ここで紹介するスクリプトは<body>につけるクラスを変更する、というものにしました。 準備 jQueryを使って動作するスクリプトなので、先にｊQueryを読み込んでおいてください。 また、クッキーも使いますので、jQuerｙでクッキーを扱うプラグイン（jQueryで簡単に
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
HugeDomains.com
IDEA * IDEA
CSS・JSを圧縮・軽量化してくれる「csszip.php」 | チバのブログ