<script type="text/javascript"> var $j = jQuery.noConflict(); $j(function(){ // ここにjQueryの処理内容を記述します。 }); </script> 個人的には 対策3 がおすすめ。 追記: 2010-02-15 以下の書き方もあるようです。 <script type="text/javascript"> jQuery(function($){ // ここにjQueryの処理内容を記述します。 // この中では$はjQueryとして扱われます。 }); </script>
JavaScript圧縮・難読化の定番ツール「/packer/」を紹介します。直感的で動作も軽量です。 /packer/ 「定番」と書いた理由は、はてなブックマークでブレイクこそしていないものの、コンスタントにブクマされているためです(2012年4月22日現在で310ブックマーク)。 使い方は、圧縮・難読化したいソースコードを上のテキストエリアにペーストして、「Pack」をクリックするだけです。 圧縮・難読化されました。 圧縮率は下のテキストエリアの右下に表示されます。 オプションは「Base62 encode(英数字のみのエンコード)」と「Shrink variables(変数名の圧縮)」の2つが用意されています。このオプションを利用しないと空白・改行を除去するだけの動作になるので、圧縮率を上げたい場合はオプションを利用しましょう。 jQuery1.7.2.js(262285バイト)で2
TwitterのタイムラインやFacebookのニュースフィードように、ページの一番下までスクロールしたらコンテンツを自動的に表示する「jQuery.Bottomプラグイン」を紹介します。 1.サンプル jQuery.Bottomプラグインにはデモページが用意されていますが、いまいちなのでサンプルページを作りました。 jQuery.Bottomプラグインサンプル ページの一番下までスクロールすると自動的にコンテンツを表示します。 なお、最初に表示した状態でコンテンツがすべて表示されてしまっているとそもそも動作しないので注意してください。 2.プラグインの機能 jQuery.Bottomプラグインは「bottom」イベントを登録するためのものです。このイベントを利用してページの一番下までスクロールすれば、bottomイベントが発生します。 3.プラグインのダウンロード githubのjQue
turn.js - The page flip effect for HTML5 HTML5で美麗なページめくり効果が作れるJSライブラリ「turn.js」 ドラッグ&ドロップでべらっとめくるあのインタフェースがHTML5で実現でき、iPadやiPhoneなどでも動作します。 電子書籍ビューアとして使えそうですね ページに立体感を出すために影なんかも描画されてます。 マークアップや初期化も超簡単です。<div>を並べて初期化するだけ。 関連エントリ HTML5で超リアルなページめくり効果を実装するチュートリアルとサンプル モバイルブラウザでのHTML5対応状況が一目瞭然の「Mobile HTML5」 HTML5/JavaScriptでテキストtoスピーチを実現できる「speak.js」
もばいる全盛感のある世間的には今更,FLASH なんてどうでもいいし,swfobject.js 自体 2009年から更新されてないから,こんな古いものをと言われかねないような話ではあるものの,日本語での言及をあまり見てないし,つい先日もさる通信キャリアがトップページでやらかしてて多分知られてないんだろうなと思ったので書こうと思った次第. swfobject.js とは何か この記事の対象読者にとっては説明するまでもない話とはおもうけど一応前置きとして説明しておくと,swfobject.js は FLASH を web ページに埋め込むための JavaScript のライブラリ.クロスブラウザ対応してたり,面倒な HTML-tag のお作法を覚えなくても良くなったりとでデファクトスタンダードな感じのモノ.2007年とちょい古いがリクルートMTL の SWFObject v2.0 ドキュメント
Coda-Slider 1.1は、先日紹介したCoda-Slider 1.0からバージョンアップをした、タブ型のコンテンツをスムーズに移動させて切り替えるスクリプトです。 Coda-Slider 1.1 Coda-Slider 1.1 デモ Coda-SliderはjQueryのプラグインで、1.1の主な改良点は下記のようになっています。 jQuery 1.2への対応 IE6, 7でタブを早くクリックした場合のバグ スクリプトオフへの対応(<noscript>) YouTubeなどの動画のバグ preloaderの採用 タブと矢印以外にもスライドするリンクを設置可能 参考: スムーズに切り替わるタブ型コンテンツ -Coda-Slider
Legendary scribbles about JavaScript, HTML5, AJAX, PHP, CSS, and ∞. デジタルカメラでは顔認識処理があたり前の時代だ。最近の画像処理アプリケーションは当然のように顔認識を実施する。いくらか学習させれば、誰が写った画像かを管理ソフトが自動的に判断して分類してくれるという機能を持っている。一度使い出すと抜け出せない便利さだ。スマートフォンでは音声認識機能による操作が普及するなど、音声認識や画像認識処理が日常生活で多用されている。 こうした処理をJavaScriptで実現する簡単なデモが「Face Detection with jQuery」で紹介されている。Jay Salvat氏が公開しているjQueryプラグイン「jquery.facedetection」を使う方法だ。使い方は簡単で、基本的にjQuery("#targetim
個人的にお勧めしているjsfiddleですが、せっかくなのでちゃんと記事にして普及活動をしてみようかなと思います。jQueryのコードを気軽に試す、などにも最適です。 全部は書ききれないのでざっくりと、程度です。一応基本的な部分だけ・・jsdo.itでいいじゃんとか言われそうな空気満々ですが、いいならこんな記事書きませんのでお察し頂ければ幸いです。 jsfiddleとは、その場でjsコードを実行、動作テストできるツールで、人気のjsライブラリのjQueryの公式サイトでもバグを伝えるときはjsfiddleを使用して動作を見せるように薦められます。 When You Report A link to a reduced, working demo/test case that will never move (jsFiddle is good for this). (意訳:バグを報告するとき
twitter facebook hatena google pocket 背景画像を動かすことでインパクトのあるサイトが構築できます。 Vegas Background jQuery Pluginはフルスクリーンで背景をスライドさせられます。 さらにドットのオーバーレイをかけられるので、カッコイイ感じになります。 sponsors 使用方法 Vegas Background jQuery Pluginからファイル一式をダウンロード。 <link rel="stylesheet" href="jquery.vegas.css" media="all" /> <script type="text/javascript" src="jquery-1.6.1.min.js"></script> <script type="text/javascript" src="jquery.vegas.js
ウェブデザインのなかで、 jqueryをつかった、さりげない「動き」をウェブサイト上で導入するのが 定番になりつつありますね。 ふわっと、ポップアップみたいに浮き上がってくるウインドウ、 画像やテキストのスライドなど 最近良く見るjqueryでつくる「動き」で、おすすめのライブラリをまとめてみます。 要素をスライドさせるならJquery.cycle.plugin 画像や、テキストなど、 非常にシンプルなhtmlソースを認識して対応してくれるプラグイン。 上から落ちてきたり、横にスライドしたり、フェードイン・フェードアウトしたり スライド番号をつけたり、スライド領域の要素の右左に矢印をつけたりもできます。 シンプルなdemo Even More Demosもオススメです。 オプション一覧はこちら → jquery.cycle.plugin ページ内ポップアップ、lightbox風表現ならfa
Let’s play hide n’ seek Hello! My name is Meerkat, I'm a jQuery plugin. I like long walks on the beach, sitting naked by a fire, playing hide n' seek, and all the peanut butter you can feed me. News & Updates November 10th, 2010 Added ability to automatically trigger “dontShowAgain” on timer method (read) April 22nd, 2010 Callback functionality now available (onMeerkatShow)! (read) April 2nd, 2010
いろいろなサイトでメニューを固定&追随させています。 今回はJavaScriptでこれを実現させてみます。 via:Live floating menu sponsors 使用方法 jQueryからjquery.jsとjquery.dimensions.jsをダウンロードします。 <script type="text/javascript" src="jquery-1.3.2.js"></script> <script type="text/javascript" src="jquery.dimensions.js"></script> <script type="text/javascript"> var name = "#id名"; var menuYloc = null; $(document).ready(function(){ menuYloc = parseInt($(name
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く