JavaScript（ジャバスクリプト）とは、HTML埋め込み型、オブジェクト指向、という特徴を持つ、クライアントサイド・スクリプト言語。HTMLやCSSなどと組み合わせることで、高度なウェブサイトを作れる。 HTML5の登場で、JavaScriptの重要性は、今まで以上に高まっている。
JavaScriptリファレンス
JavaScript（ジャバスクリプト）とは、HTML埋め込み型、オブジェクト指向、という特徴を持つ、クライアントサイド・スクリプト言語。HTMLやCSSなどと組み合わせることで、高度なウェブサイトを作れる。 HTML5の登場で、JavaScriptの重要性は、今まで以上に高まっている。
Backbone.js入門 「Events」 - Qiita
閲覧上の注意 この記事で対象としているバージョン0.5.3は結構古いので注意してください。この記事でいえば、bindは無くなり、現在ではonやlistenToが使われています。 その他の割りと新しい情報は Backbone.js Advent Calendar 2012 などにあります。 （追記ここまで） ネタ切れ感が否めないBackbone.js Advent Calendarですが、今回から何回かに分けて懇切丁寧な入門記事を書いていこうと思います。 以下のように書き進めていく予定です。 Events View Model ViewとModelの連携 Collection ViewとModelとCollectionの連携 RouterとHistory なおここで扱うBackbone.jsのバージョンは0.5.3です。 Backbone.js入門 「Events」 Backbone.jsの
Backbone.jsを利用したクライアントサイドMVCの導入についてそろそろ書いておくか - 出町ミスド攻防記
jQueryヘビーなアプリケーションの問題点と、MVCによる構造化の必要性 jQueryは、ブラウザ上で動くJSアプリケーションの開発生産性を劇的に向上させました。DOM操作による動的なページ書き換え処理などは、セレクタを使ってちょろっとコードを書くだけで、ほんの数行で記述できてしまいます。 しかし、この方法の延長で、大規模なJSアプリケーションを構築することは果たして現実的でしょうか。例えば「GMail」や「New Twitter」程度の規模のJSアプリケーションを書かなければならないとしたら、どうでしょう？ 大規模なJSアプリケーションを開発するには、こういった手法を延長するのではなく、より洗練されたデザインパターンを導入する必要があります。この目的にぴったりのデザインパターンが、「MVC」デザインパターンです。 MVCパターンは、Webの世界ではサーバサイドプログラミングで広く知られ
JavaScript MVCフレームワークはすでに十種類以上、その比較や最新情報などのまとめ
グーグルが開発したJavaScript MVCフレームワーク「AngularJS」を紹介した1つ前の記事の反応が予想以上に大きく、1日たたずにブックマークが500以上もつきました。 本記事では、AngularJS以外にもすでにたくさん存在するJavaScript MVCフレームワークに関する情報をまとめて紹介したいと思います。 JavaScript MVCフレームワークの比較記事 既存のJavaScript MVCフレームワークを比較した記事が「The Top 10 Javascript MVC Frameworks Reviewed」です。Top10と書いてありますが、12種類のフレームワークの比較です。これは公開当時は10種類だったものが、その後11種類になり、今回のAngularJSの公開で12種類になったためです。 上記のような比較表を載せた上で、12種類すべての利点と欠点を説明し
Backbone.js のメモ - Memo
jQuery だけでサイトを作っているとちょっと規模が大きくなると見え辛くなってくるので Backbone.js を使おうと思い情報収集している。 以下自分の為のリンク集。 オフィシャルサイトのドキュメント http://documentcloud.github.com/backbone/ チュートリアル オフィシャルの ToDo アプリケーション http://documentcloud.github.com/backbone/docs/todos.html 上記の ToDo だと最初の一歩としては複雑すぎる。 こっちの方が分かりやすかった。 Hello Backbonejs – Artur Adib 日本語は Qiita のアドベントカレンダーが分かりやすい。 Backbone.js Advent Calendar 2011 - Qiita WebSocket というか SocketI
関数 - JavaScript | MDN
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015年7月. * Some parts of this feature may have varying levels of support. Learn more See full compatibility Report feedback 一般的に言うと、関数とは外部 (再帰の場合は内部) から呼び出すことのできる「サブプログラム」です。プログラムそのもののように、関数は関数本体 (function body) と呼ばれる連続した文で構成されます。関数には引数として値を渡すことができ、関数は値を返すことができます。 JavaSc
[Javascript] 関数宣言の落とし穴 function foo ( ){..} と var foo = function ( ) {..} は動作が違うので要注意！
Home Subscribe function funcname(args){ do something}; は var funcname = function(args){ do something}; と等価になる。 javascriptを理解するためのたった2つの大切なこと javascriptを理解するためのたった2つの大切なこと:改 引用元の記事はすばらしい記事ですが、ここは間違いです。 等価だと思っていたらひどい目にあいます。 サイ本 第5版のp.96にちゃんと書いてあります。 function文はプログラムの静的な構造を定義するだけなのです。 JavaScriptコードが解析されコンパイルされたときに、関数は定義されます。 どういうことかというと、 function foo( ){ ... } はコンパイル時に関数が定義されます。 var foo = function( ){
SwipeView – Matteo Spinelli's Cubiq.org
SwipeView is the super simple solution to endless seamlessly loopable carousels for the mobile browser. It’s memory conservative as it uses only three elements at any given time, it’s smooth as velvet since it takes advantage of hardware acceleration, it’s bandwidth friendly with its 1.5kb minified/gzipped footprint. Download Live Demo GitHub Project info Last code update: 2012.08.25 – v1.0 Device
見せ方がとても良いモーダルjQueryプラグイン「Avgrund Modal
twitter facebook hatena google pocket モーダルってだいたい定形が決まった感じですが、今回のjQuery plugin for Avgrund concept popinはクリックするとぐいっと中に寄って目立つ感じにしてくれます。 sponsors 使用方法 jQuery plugin for Avgrund concept popinからファイル一式をダウンロード。 <link rel="stylesheet" href="avgrund.css"> <script type="text/javascript" src="jquery-1.7.2.min.js"></script> <script type="text/javascript" src="jquery.avgrund.js"></script> <script type="text/ja
PCスマフォ両用できる階層メニューを実現するjQueryプラグイン「Simple Responsive jQuery Navigation Plugin」
twitter facebook hatena google pocket 昨今はレスポンシブデザインが流行している感じですが、Simple Responsive jQuery Navigation Pluginを利用すると、階層化されたメニューもいい感じで対応してくれます。 sponsors 使用方法 Simple Responsive jQuery Navigation Pluginからファイル一式をダウンロード。 メニューは下記のようなシンプルで3階層まであるもの。 <ul> <li><a href="#">Home</a></li> <li><a href="#">About</a> <ul> <li><a href="#">Our Mission</a></li> <li><a href="#">General Info</a></li> <li><a href="#">Hist
印刷時にリンクをQRコード化してくれるjQueryプラグイン「printQr jQuery Plugin」
twitter facebook hatena google pocket ちょっとマニアックな使い方かもしれませんが、印刷時にリンクをQRコード化してくれるjQuery.printQr() Pluginを紹介します。 画面では見せたくないけど、印刷した時に携帯とかで閲覧してみてもらいたい時に利用してみてはいかがでしょうか。 なお、対象リンクをhiddenにしても印刷時にQRは表示されるので隠しクーポンとかにも使えるかもしれません。 sponsors 使用方法 jQuery.printQr() Pluginからファイルをダウンロード。 <script type="text/javascript" src="jquery-1.7.2.min.js"></script> <script type="text/javascript" src="jquery.printqr.js"></scrip
jQueryプラグイン検索：skuare.net
検索ワード： JSONファイルから画像スライダーを作成するjQueryプラグイン「jsonslider」 スライダーJavaScript「Swiper」で簡単スマホ対応！軽量／レスポンシブ／スワイ 背景に線を引いて印象的なサイトに！jQueryプラグイン「Lines.js」 画像を簡単にInstagram風に加工！jQueryプラグイン「simpleFilter.js」 画像を印象的なドット絵にしてくれるjQueryプラグイン「Breathing Halftone」 ちょっとしたアニメーション効果で印象をぐっと良くするためのjQueryプラグイン「animo.js」 国際電話番号を判別するjQueryプラグイン「jquery.mobilePhoneNumber」 多機能／スマホ／動画対応のギャラリーJavaScript！jQueryプラグイン「lightGallery」 テキスト表示を印象
検索で使用したキーワードをハイライト表示するjavascript「searchhi.js」
twitter facebook hatena google pocket 検索エンジンで入力したキーワードが、閲覧したページでハイライト表示されていることがあります。 searchhiは、これを可能にするjavascriptです。 これにより簡単に検索キーワードを提供でき、閲覧時間を高めることができるかもしれません。 追記： （2008/2/12）以下、記入ミスがありましたので、修正しました。 修正前：<script src="http://yourdomian/jquery.js" type="text/javascript"></script> 修正後：<script src="http://yourdomian/searchhi.js" type="text/javascript"></script> sponsors 使用方法 導入はいたって簡単です。 searchhiからsea
コンテンツをスライド表示させるJavaScript「Slide box」
デザインの都合上、省きたいが、でもこのコンテンツ入れたい。。。 そんなサイト制作者の葛藤を解消してくれるのが、Slide boxです。 最初は隠しておきながら、ボタンを押すとエフェクトつきで表示されます。 使用方法 Slide boxからslidebox.js、slidebox.cssを、jQueryからjquery.jsをダウンロードします。 <link rel="stylesheet" href="slidebox.css" type="text/css" media="screen"> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="slidebox.js"></script> <script> $(document).ready(function
サイドからパネルがスライドインする - かちびと.net
Result jQuery //クリックイベント $('.open').click(function() { //パネルをアニメーションでトグル出来るようにする $("#panel").animate({width: 'toggle'}, 300); }); css #panel { height: 600px; width: 200px; padding:20px; background: #eee; float: left; display: none; color: #666; font-size: xx-large; } .open { height: 20px; width: 70px; background: #666; padding:20px; float: left; margin-top: 200px; color:#fff; } html <div id='panel
少しのコードで実装可能な15のスマートフォンサイト用小技集
少しのコードで実装可能な15のスマートフォンサイト用小技集スマートフォンが普及してきて、Webサイトを作る時、スマートフォンサイトも一緒に制作している方も多くなってきていると思います。私もスマホサイトを制作する機会が増え、だんだんEvernoteに保存していたスマートフォンサイトを作る時の小技がたまってきたので、iPhoneで使える小技を中心にまとめて記事にしてみます。いくつかサンプルも作っているので、スマートフォンからあわせてご覧下さい！ スマートフォンサイト用小技集 目次いくつかサンプルも作ったのでスマートフォンから、もしくはブラウザーからユーザーエージェントを iPhone などに切り替えてご覧ください！ 横幅をデバイスの幅にあわせる文字サイズの自動調整をオフリストのクリック（タップ）範囲を広げる画面の幅にあわせて CSS を変えるリンクテキストのある Div 全体をクリック（タップ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - enja-oss/Backbone: Backbone ドキュメント日本語訳
ふじこのプログラミング奮闘記
Rainbow – ソースコードをシンタックスハイライトしてくれるJavaScript – creamu
綺麗なローディングを設置できるJavaScript「Percentage Loader」