サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
衆院選
byuzensen.com
* はじめに!! お疲れ様です!JavaScript大好き、ぴーすけです! みなさんはJavaScriptのイベントについて、詳しく説明ができますか? 正直、私はいまいちわからずにコーディングしていたのですが、これじゃあいかん!と思い色々調べていたところ、「イベントバブリング」という単語に行き着きました。 イベントの伝播を理解するには必要な知識だと思うので、私のわかる範囲でまとめてみたいと思います。 * そもそもイベントってなんなんだよ!! まずはこれが気になりました。イベントってなんなのよ。 以下の考え方はあくまで私の見解です。間違っていたら指摘をしていただけると嬉しいです。詳しい人がいたら教えてください!! イベントとは JavaScriptでよく「イベントを設定する」とか言うけど、なんかおかしいなーとおもっていたんですよね。だってイベント自体は自分で定義していないですよね? イベント
WEBアプリを公開するためには、サーバーを借りたり、ドメインを借りたり、他にも色々とにかく大変です。 Herokuは、それらの面倒くさいことを代わりにやってくれるサービスになっています。 なので、こちらはとにかくWEBサービスを作るだけで良いんです。便利!!全部英語だけど便利!! * 前提 必要なものとしては まず、公開するサービスを作ってあることが前提です。今回私は以前node.jsとexpressを使ってルーム機能のあるリアルタイムチャットを作る!!で作ったリアルタイムチャットアプリを公開します。実装にはnode.jsとexpressを使っています。 そして、gitが使えるようになっていることが前提です。gitはGit – Gitのインストールなどを参考にインストールしておいてください。 npmは、サーバー上でnode.jsを使うための設定ファイル作成時に必要になります。node.js
* はじめに!! お疲れ様です!ぴーすけです! JavaScriptで処理のタイミングを遅らせる方法として「window.onload」に処理を登録する方法があります。 今回はそのいろいろな書き方についてまとめたいと思います。 * 書き方!! JavaScript① window.onload = function() { 処理 }; JavaScript② window.addEventListener('load', function() { 処理 }); jQuery $(window).on('load', function() { 処理 }); この3つの書き方はどれも同じタイミングで処理が動きます。 * 処理が実行されるタイミング!! loadイベントに紐付いている処理は画面の表示が始まってから、HTMLの構造はもちろん、画像のロードなどが全て完了してから処理が走ります。 なの
要素を横並びにするには、floatとoverflowを使用します。 css //外側を囲っている要素 #wrapper1 { width: 100%;//外側の幅を決める } //左側の固定幅要素 #wrapper1 .left { float: left;//固定する位置を決める(左側に固定) width: 100px;//固定幅を決める } //右側の可変幅要素 #wrapper1 .right { overflow: hidden;//これが大事 width: auto;//幅を決めない } 固定したい要素(width: ○○px)にfloatをかけて、可変の要素(width: auto;)にoverflow:hidden;を書くと横並びになります。もちろんfloatとoverflowをかけた要素達を囲って幅を指定することで、好きな幅や位置でこの横並びを実装できます。イメージとしては
アクティビティモニタを起動すると以下のようなウィンドウが立ち上がります。 この中から日本語入力プログラムをダブルクリックで起動させます。 そうすると上記のようなウィンドウが開くので、終了させます。 日本語入力プログラムを終了させると、消えなかった変更候補リストが消えると思います。 日本語入力プログラムは明示的に再起動させる必要はなく、日本語入力を始めると勝手に起動し、変換候補が表示されるようになります。 * まとめ!! macで変換候補リストが消えなくなった時は、日本語入力プログラムを再起動しましょう。
* はじめに!! ポケモンGO楽しいー! こんにちは!ぴーすけです! 今回はRiot.jsのルーティング機能でSPA(シングルページアプリケーション)を作りたいと思います! とおもったのですが、SPAの定番である画面をふわっと切り替える方法が見つからなかったので、無理やり実装してみました! もしもっと良い方法があったら教えてください! * まずはRiot.jsを使った基本的なルーティング機能!! 多分一番簡単なルーティン機能はこんな感じだと思います。上に固定メニューを用意したので、そのリンクを押すと画面が一部切り替わります。 ソースを見るには「html」タブを押してください。
* はじめに!! どうも!ぴーすけと申します!! 最近のWEBサイトでは当然のように実装されている機能として、スムーズなスクロール機能がありますよね。 このサイトでもページを下の方にスクロールすると画面下に「TOP」ボタンが表示され、そのボタンを押すと画面最上部へスムーズにスクロールされるようになっています。(PCのみ) 実装するには、jQueryのプラグイン「smoothScroll.js」などが有名ですが、今回は余計プラグインなどは使用せずに、jQueryだけで実装する方法をご紹介します!! * なめらかなスクロール!!まず、単純に画面最上部へスクロールするようにするためには、以下のように記述するのが一番簡単な実装方法だと思います。 もちろんプラグインは不要で、jQueryだけ読み込める状態なら動作します。 まずはボタンを用意します。デザインは適宜調整してください。私の場合はfixed
* はじめに!! こんばんは!ぴーすけです! 巷で噂の「Riot.js」の基本的な機能を使ってみました!名前がかっこいいし、なんか評判がいいから気になっていたんですよねー 簡単だ簡単だとは聞いていましたが、確かにあっという間にやりたい事が実装できました。 今回はそんなRiot.jsの基礎の基礎をまとめたいと思います。 【注意】 Riot.jsは比較的新しいフレームワークなので、バンバンバージョンアップをしています。これから紹介する記述はバージョン2.5.0で実際に動いた方法となります。 動作は確認していますが、記述方法が最適なものかどうかはわかりませんので、ご了承ください。
このページを最初にブックマークしてみませんか?
『byuzensen.com』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く