コピペでサクッと導入できるライブラリ非依存のJavascriptカウントダウン
期間限定商品のセールスページなどで購買率を上げるカウントダウンのJSスクリプトです。特徴はJQueryなどのライブラリを必要とせず使いたい場所にサクッとコピペで動くのと、cssで細かく装飾できるように適所にclassが定義してあります。 使い方 下のJavascriptとdiv要素を使いたい場所のコピペします。div内にカウントダウンが表示されます。下にあるfunction CDT(){}の中で期限日時やdivのID名、カウント終了後のメッセージを指定します。 この例では、2036年1月1日までカウントダウンします。 <div id="CDT"></div> <script language="JavaScript" type="text/javascript"> function CountdownTimer(elm,tl,mes){ this.initialize.apply(this
jQueryでフォームの入力チェック | kizukiウェブスクール川越校5階
ウェブ制作において、jQueryが最も使用される機会が多いのが、フォームのバリデーションチェック機能。 バリデーションチェックとは、メールアドレスなら「xxx@xx.xx」という入力形式になっているか？必須項目はちゃんと記入されているか？を確認し、もし誤りがあればそれを閲覧者に知らせる機能のこと。 jquery-form-validatorを使った入力チェック Position-absolute「jquery-form-validator」 フォームの入力事項をチェックするバリデーション用プラグインは数あれど、このjquery-form-validatorは多機能な上に、設定が非常にわかりやすいのでおすすめ。 ちなみに導入例のデモはこちら。 確認してもらえば分かるとおり、送信ボタンを押すタイミングだけではなく、項目を入力して（あるいは入力しないで）フォーカスが移るタイミングでもバリデーショ
iPhone/iPadでダブルタップが利用できるjQueryプラグイン「jquery.event.dblTap.js」
iPhone/iPadでダブルタップが利用できるjQueryプラグイン「jquery.event.dblTap.js」 iPhone/iPadでダブルタップをJavaScriptで実装するで紹介してたダブルタップの実装方法をjQueryプラグインにしてみました。 利用方法 jQuery本体とjquery.event.dblTap.jsをhead要素などで読み込みます。 <script src="jquery-.min.js"></script> <script src="jquery.event.dblTap.js"></script> 後は「dblTap」をbindするとdblTapイベントが実装できます(クリックにも反応するようにしています)。 $("button").bind("dblTap",function(){ alert("duble tap"); }) デモ 初期設定では5
入力されたテキストを自動で指定の形式(半角, 全角, ひらがな, 全角カタカナ)に変換する | ヨモツネット
概要 ユーザがフォームに入力したとき、指定の形式 (半角,全角,ひらがな,全角カタカナ) に自動で変換してあげるための JavaScript ライブラリです。 動作確認用の demo ダウンロード 使い方と説明 動作させるためには、ダウンロードした valueconvertor.js を (X)HTML ファイルの head 要素内などで読み込みます。 <script type="text/javascript" src="js/valueconvertor.js"></script> さらに、変換の動作の目印とするための class 属性値を設定します。<input type="text" class="ascii" />のように、input 要素に対して、指定の class 属性値をつけると動作します。class 属性値と動作の内容の対応表については以下の通りです。 値の形式 clas
株式会社クライマークス | 東京のWeb制作・Webコンサルティング会社
企業コミュニケーションに、 クリエイティブで解を。 企業、学校、公共団体などのお客さまが、メディアを通じて行うブランディング／マーケティング／リクルーティング ―― 私たちは、そこで生じるさまざまな課題を、創造性と創造力で解決します。
グーグル製のJavaScript MVCフレームワーク「AngularJS」、正式版が公開 − Publickey
グーグルは、JavaScriptでMVCアーキテクチャのアプリケーション開発をする際に便利な機能を備えたライブラリ「AngularJS 1.0」のリリースをブログで発表しました。 MVCアーキテクチャとは、ソフトウェアがデータモデル（Model）の部分とユーザーインターフェイスの部分（View）、そしてビューとモデルのあいだで制御する部分（Controller）に分離された構造のことを指します。 これらが分離されているとプログラムの見通しがよくなり変更にも対応しやすく、テストも容易になるため、何種類ものユーザーインターフェイスと複雑なロジックなどから構成される大規模なアプリケーションではMVCアーキテクチャの採用が望ましいものと考えられています。 しかしWebアプリケーションをMVCアーキテクチャで実現しようとすると、ビューの役割を果たすHTMLのコードの中に、どうしても複雑なJavaSc
JavaScript アニメーションのデザインパターン
JavaScript でアニメーションを作る アニメーションとは何？ ビューを少しずつ回転、拡大縮小、移動、変色などを行い、連続的な動きを作る こんな感じ <div id="view">hoge</div> <script> var el = document.getElementById('view'); el.style.opacity = 1; setInterval(function() { el.style.opacity -= 0.01; }, 10); </script> なんで、あんな感じの書き方になるの？ setInterval の意味が分からない こんな感じで書けないの？ <div id="view">hoge</div> <script> var el = document.getElementById('view'); el.style.opacity = 1; w
Youtubeの動画を背景に
Introduction In the ever-evolving landscape of web browsing, staying abreast of the latest technologies is crucial. HTML5, the fifth and current version of the Hypertext Markup Language, has revolutionized the way we experience the web. With its advanced features and enhanced capabilities, HTML5 has become the cornerstone of modern web development, offering a more seamless and interactive user exp
AjaxMail：Ajaxを活用したフリーPHPメールフォーム
ウェブサイトを動的なページに変更したい、機能を拡張したいと思ったら、 Ajaxのツールを使って簡単に機能を拡張してみよう。 ウェブサイトを運営するとき、サイトを見たユーザーからコメントを残してもらうことがあります。 また、企業なら連絡方法としてメールの送信ができるように、メールフォームを用意していると思います。 こうしたウェブサイトのメールフォームをAjaxを使って導入することができます。
jQuery 日本語リファレンス
jQueryとは、JavaScriptのコーディングを強力に支援するライブラリです。 $('.semooh a').hover( function(){ $(this).text('ヌ？'); }, function(){ $(this).text('ヌー'); } );
jQueryの日本語の解説サイトと国産のプラグイン集
MopBox 複数パネル（デモには100以上のパネルも）の表示にも対応した、画像・Flash・動画などを表示できるドラッグ移動可能なボックス。
ETC/属性リファレンス
適応要素 ：body、frameset スクリプトによって指定された文書やオブジェクトの、すべて読み込みが完了した瞬間に発生するイベント属性です。スクリプトと併用します。
[CSS]Javascriptでスタイルシートを切り替えてフォントサイズ変更
Javascriptを用いてCSSを切り替えるスクリプトを利用して、フォントサイズを大、中、小に切り替えれるようにしてみました。 実装したのは初心者のためのPC用語講座です。 利用方法は簡単で、まずはAlternative Style: Working With Alternate Style Sheetsにてスクリプトをダウンロードします。 これをhead内で呼び出します。スクリプトで利用するスタイルシートも呼び出します。 — HTML — <head> <link rel="stylesheet" type="text/css" href="style.css" title="standard"> <link rel="alternate stylesheet" type="text/css" href="style1.css" title="alternate1"> <link re
![[CSS]Javascriptでスタイルシートを切り替えてフォントサイズ変更](https://cdn-ak-scissors.b.st-hatena.com/image/square/e82ad3e0320e242ee2f9903b26f510ad1d827d12/height=288;version=1;width=512/https%3A%2F%2Flp.olivesystem.jp%2Fwp-content%2Fthemes%2Fsimplicity2-child%2Fimages%2Fog-image.jpg)
FLASHからHTMLへアンカー付きでgetURLするとき
「トップのFLASHにRSSニュース読み込んでるんだけど、 そこからHTMLでアンカーリンクさせると、タイトルタグに変なの付くんだけど！ ・・・IEだけ。」 以前からたまーにそんな現象出てましたが、IEバグ仕様で回避策がないってことでスルーしてたんですが 一応Javascript...
[JS]jQueryの効果的な使い方を実例から学ぶ -Use jQuery
Use jQueryは、JavaScriptのライブラリ「jQuery」とそのプラグインを使用したウェブサイトのショーケースです。
[ajax] JavaScript版 RSSリーダー
Kawa.netxp [ajax] JavaScript版 RSSリーダー RSS（ウェブフィード）をダウンロードし、 テンプレートを使用してHTMLページ中に展開する ajax の習作です。 JKL.ParseXML と JKL.Hina を利用しています。 RSS をダウンロード～展開 (DEMO) JavaScript ソース HTML テンプレート RSS 2.0 を利用している場合 日時の表示形式を変更する 表示件数を制限する 対応ブラウザ 応用例 コメントはこちらへ このページへのトラックバック RSS をダウンロード～展開 (DEMO) ボタンを押すと、 RSSファイルをダウンロード～展開します。⇒ 実行 [ここに展開されます] JavaScript ソース JKL.ParseXMLとJKL.Hinaを利用するので、 まず、head 要素内で jkl-hina.js と jk
Google マップ JavaScript API V3 まとめ
Home Google マップ JavaScript API V3 まとめ Google マップ JavaScript API V3 まとめ 地図コンテンツ作成とカスタマイズ例です。現在グーグル Maps Javascript API のバージョンは「V3」で、Nexus などのタブレットや Android スマートフォンにも適しています。 以下のほか、ブログも参照して下さい。このページに未掲載のマップが多数あります。 V2は2010年5月19日、正式に廃止されています。Google はV3への移行（Google Geo Developers Blog: GoV3: It's time to Upgrade）を奨めています。2013年11月19日以降（機能により）使えなくなっています。 2013年5月、ラベル類が更新されました。javascript の冒頭に google.maps.vis
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
CKEDITOR.config - CKEditor 3 JavaScript API Documentation
Loading...
JavaScriptをサーバーの時刻に合わせる