パララックスサイトの作り方の初歩
最近パララックス（視差効果）を取り入れたサイトが増えてきました。 仕組みや簡単なものを作れるようにしておきたかったのでいろいろ試してみました。 ちなみにもっと効率良く作れる方法とかもあるかもしれませんので、一例ということで御覧ください。プラグインはまだ試したことがないので そちらを使ったほうが楽かもしれません。 パララックス効果のjQueryプラグインまとめ あと動作はこの記事時点でのFirefoxの最新版でしか確認はしていません。 スクロール量を取得する まずはスクロールすると動くので、スクロール量を取得します。ちなみにjQueryを使ってます。 $(function(){ $(window).scroll(function(){ var y = $(this).scrollTop(); $("#num").text("スクロール量：" + y);//表示用 }); }); サンプルペー
今すぐ辞めて欲しい、「jQuery勉強してます」「Backbone.js勉強してます」
最近、といってもここ２年ぐらいからだけど、「jQueryの勉強してます」とか「Backbone.jsの勉強してます」とか、そういう人からのプログラミングの修得の相談とかを頂いたりする機会が多い。 それらの中で、非常に口をすっぱくして言っているんだけど、なかなか理解して頂けないのが、『「jQuery」や「Backbone.js」を使うな』という個人的なアドバイスだ。これは個人的には本当に守ってほしい、絶対に手を出してほしくない、Framework達である。 なぜかみんな「jQueryってイケてる技術だよね」「jQueryだったらこんなこともいとも簡単にできちゃうんだよね」みたいな印象を持っている。もちろん、それは間違いではない。jQueryは早い。ライブラリもたくさんある。コミュニティも活発だ。リッチなウェブサイトなんて昔は数人月かけて作ったものだが、いまはjQueryとプラグインなんて使え
すごい便利になった！javascript入門の基礎知識と小技まとめ
作成：2013/12/24 更新：2014/11/01 Web制作 > サイト構築中にちょっとした動きをのせたいとき、どうすれば良かったのか何度も調べ直さないといけないことがあります。今回はJavaScript で初心者の方でもすぐ活用できるように、使用頻度の高いリファレンスと基本知識をまとめました。 エンジニア速報は Twitter の@commteで配信しています。 もくじ できること １．リファレンス スクリプトの書き方／基礎知識 ２．スクリプトの記述 ３．文字列／特殊文字 ４．演算子 ５．オブジェクト ６．プロトタイプ ７．イベント ８．変数 ９．if文 １０．配列 １１．連想配列 １２．正規表現 １３．デバッグ できること １．リファレンス JavaScriptは開発環境の準備がほぼ不要で、コピー＆ペーストだけで、動くものができてしまいます。他の言語だとそう簡単にはいきません。サ
PHPでjQueryチックにWebサイトをクローリングする方法 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
あ、どうも僕です。 今日はPHPでWebサイトをクローリングしてjQueryチックにDOMを操作して、データを取得したり、画像などをダウンロードする方法について書こうと思うよ！ これができると何がうれしいかって、いつも手動で巡回しているサイトなんかにアップされてる画像データを自動でダウンロードできるようになるんだよね。 人がやっていた作業をコマンド一発で自動化できるから、捗ること間違いなしだよ！ あれ、この人、この前node.js使って同じことやってなかったっけか？ node.jsを使ってjQueryチックにWebサイトをクローリングする方法 なんで同じことをPHPでやってんだ？とか思っていやしないだろうか。ああそうさ！ついこの前、node.jsで全く同じことをやって記事を書いたさ！なぜかって！？それは、node.jsの非同期地獄にやられたからさ！ やつめ、データのダウンロードからデータベ
画像スライドショーでjQueryプラグインの基本を学ぶ
画像スライドショーでjQueryプラグインの基本を学ぶ：jQuery×HTML5×CSS3を真面目に勉強（2）（1/4 ページ） はじめに この連載で取り扱っているjQueryはJavaScriptのライブラリエンジンです。 世の中には実にさまざまなプログラミング言語があります。昨今主流となっているものの大半は、オブジェクト指向プログラミング言語と呼ばれているものです。 代表的な例を挙げると、Java、C#、Ruby、Python、Objective-Cといったところでしょう。これらの言語はクラスベースというカテゴリに属しています。クラスベースはアプリケーションにおけるさまざまな機能をクラスと呼ばれる単位でキッチリと分割することで、プログラム全体をキレイに整理整頓できるという特徴を持っています。大規模な開発になるほど、この特徴が威力を発揮するため、先に挙げたプログラミング言語が積極的に採用
ソースがシンプルなJSによるロールオーバー｜CSS HappyLife
Webは略語じゃないのに「WEB」って書く人が多いのが気になって仕方ない今日この頃。（あ、音声ブラウザを配慮したらという場合です） さて、本題に。 CSSのみでロールオーバーするテクニックは有名でございますが、ココ最近JSでいいじゃん。と思うようになってます。 ってことで、こんなサイト名ですけどJavaScriptでやるロールオーバーの方法のひとつでも。 jsファイルのご用意 何はともあれ、下記のjsファイルをご用意します。 function smartRollover() { if(document.getElementsByTagName) { var images = document.getElementsByTagName("img"); for(var i=0; i < images.length; i++) { if(images[i].getAttribute("src")
jQuery – チェックボックスがチェックされたらスタイルを変更する | 1：n – DETELU Blog
なんか久々にjQueryを触りました…。 セレクタ（属性フィルタ）に変数の値を利用する場合の記述を試したんですが、1.3.1はセレクタまわりが変更になっているからなのか、IE6,7、FirefoxでOKだったのですが、safariが動作せず。 で、ちょこっと調べてみると jQuery 1.3系からはsafari2は対応してないと。そういうことですか…。 jQuery: » jQuery 1.3.1 Released ブラウザーのシュアの問題で対応をはずしてるみたいですね。しかし下記ページを見てsafari3.xが6%近いシェアがあるってのでびっくり。safariってそんなにも使ってる人いるんですかね？ Browser market share まあ一応safari2.xもOKなように1.2.6を使っておきました。 作ったものはというと、チェックボックスにチェックをした時に文字のスタイルを変
[JS]複数のエレメントをターンテーブルのようにぐるぐる回すスクリプト -Roundabout
デモ：Around Other Things 回転の中心に他のエレメントを置いたデモ。 Roundaboutの使い方 Roundabouの実装方法を簡単に紹介します。 詳しい実装方法については「Learn」をご覧ください。 Roundabout -Learn HTML ぐるぐる回転させる各エレメントをリスト要素で実装します。 <ul> <li></li> <li></li> <li></li> <li></li> <li></li> </ul> 外部ファイル 「jquery.js」と当スクリプトを外部ファイルとして記述します。 <script src="jquery.js"></script> <script src="jquery.roundabout.js"></script> JavaScript jQueryのセレクタで指定し、Roundaboutを実行します。 <script>
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
