タグ

pjaxに関するnyanzou4649のブックマーク (11)

  • pjax - 実装|PORTFOLIO PAPER by FAT

    pjax - jquery plugin 10 pjaxはデータの読み込みと描画の冗長部分を省略することで非常に高速かつ低コストなページ移動を実現する、HTML5で実装される次期標準ブラウジング機能です。 pjaxはこのプラグインを使用することでサーバーに手を加えることなく簡単に導入できます。 最新版のダウンロード プラグインの最新版はGitHubで公開していますのでそちらからダウンロードしてください。 GitHub:https://github.com/falsandtru/jquery.pjax.js ファイル:https://raw.github.com/falsandtru/jquery.pjax.js/master/jquery.pjax.js 概要 サイト内のページ移動において指定したHTML要素(異なるコンテンツを持つ領域)のみ更新することでページ移動を高速化します。ajax

  • HTMLで動きのあるページ遷移を実現するには。 | ラズル株式会社スタッフブログ

    どうもOです。今日はFLASHではなく、HTMLベースで動きのあるページ遷移を 実現する方法を考えてみたいと思います。 WEBページが変わる際、通常WEBブラウザはサーバーにアクセスし、必要な情報が取得出来るまで処理が出来なくなります(同期通信)が これに対し、必要な情報が帰ってくるのを待たずに他の事が出来てしまうのが非同期通信と呼ばれるものです。有名なのはAJAXですね。javascriptと AJAXを使用する事によって、必要な情報を非同期で取得出来るようになります。 そしてAJAXが素晴らしいのは、ページ遷移を行わずに必要な情報を取得、ブラウザで表示できる点です。つまり一回ページが真っ白になることなく、 他のページへ移動できるということですね。そしてこれこそ、動きのあるページ遷移の鍵というわけです。 しかし、このAJAX、実はいくつか問題があります。 一つは、外部の情

  • #294 Playing with PJAX - RailsCasts

    pjaxはChris WanstrathによるjQueryプラグインで、HTTPリクエストでページ全体を取得するのではなく、AJAXリクエストによってページの一部を簡単に更新できるようにします。デモページでどのように動作するかを見ることができます。デフォルトでは、このページにあるいずれかのリンクをクリックするとページ全体がリロードされます。これはページ上の時刻表示が変わることでわかります。チェックボックスをクリックしてpjaxを有効化すると、リンクをクリックしてもページ全体がリロードされることはなく時刻も更新されませんが、ページのメインセクションは変化します。 pjaxはpushStateを使用するのでユーザはAJAXリクエストがバックグラウンドで生成されていることに気づきません。pjaxがページを更新するごとにアドレスバーのURLが更新され、ページのタイトルが変わり、前のページがブラウザ

  • cacheありのpjax #javascript

    https://github.com/ukyo/jquery-pjax/tree/cached-pjax jquery-pjaxですでに読み込んだページをキャッシュしておいてサーバアクセスを減らすようにしてみたよ。キャッシュはsessionStorageに保管しておくのでウィンドウを消すとキャッシュは消えるよ。ただしリロードだとキャッシュは残ったままだよ。 使い方: デフォルトだと無効だよ。enableCacheをtrueにしてね。 $("a.pjax").pjax("#main", { enableCache: true }) //なにか変更したら適宜$.pjax.setCache()を呼ぶとその時点の状態がキャッシュされるよ。 $(".hoge").live('click', function(e){ foo(); $.pjax.setCache(); }); ソースコードの変更点:

    cacheありのpjax #javascript
  • ukyo/jquery-pjax at cached-pjax · GitHub

  • AjaxでもURLを更新して履歴を作れるHTML5のpushState試してみた

    Posted: 2011.06.20 / Category: javascript / Tag: Ajax, HTML5 高速なWebアプリケーションを作成するにはAjaxがなくてはならないものとなりました。AjaxにはURLが更新されず、そのためブラウザの戻るも使用でません。 このような問題を解決するためにHTML5で追加されたのが「pushState」です。 pushStateを使用していないサンプル jQueryのloadメソッドを使用したコンテンツ切り替えの簡単なサンプルです。 page1.html <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>page1</title> <link rel="stylesheet" href="style.css"> <script type="text

    AjaxでもURLを更新して履歴を作れるHTML5のpushState試してみた
  • 独学でコーディング! - a-newcomer.com

    ここ数年、会社を辞めて自分のペースで仕事を請け負うフリーランスという形態で仕事をする人が増えています。フリーランスには様々な職業があり、代表的なものでは翻訳業やイラストレーター、YouTuberもフリーランスに分類されます。そして代表的なフリーランスの職業がもう一つあります。それはプログラマー/エンジニアです。そのプログラミングの大部分を占める工程がコーディングであり、知識と技術を身につければ、憧れのフリーランスに鞍替えすることも夢ではありません。 それではコーディングの知識と技術を取得するにはどのようなルートがあるのでしょうか?現実として学校に通うか、プログラミングを請け負う会社に入社するか、あるいは独学で取得するかのいずれかを選択することになります。そこで今回は最も費用の少ない独学でコーディングを学ぶ方法を紹介したいと思います。 独学でコーディングの知識と技術を身につけるには まずはプ

    独学でコーディング! - a-newcomer.com
  • http://blog.yuku-t.com/entry/20110823/1314111340

    http://blog.yuku-t.com/entry/20110823/1314111340
  • Rails3.2 + pjax を使ってみた。+ pjaxでのgoogle adsense - kaeruspoon

    kaeruspoon のデザイン変更とあわせてRails3.2.2化 + pjax対応をしてみました。 pjax対応は、ライブラリが用意されているので思いの外簡単です。今のところ、DHHがつくった pjax_railsと、Rackに組み込んで使う rack-pjaxが有名なようです。 pjax_railsの使い方は簡単です。READMEにあるとおりですが、まずGemfileで設定しておきます。

  • ニコニコプレイヤーZeroについて | ぶろゲ

    他の人の感想を見る前にこれを書いておきたい。まぁ、きっと非難轟々だけれども。 第一印象 黒い でかい でかい 大画面:908×486,中画面:672×486,小画面:908×150 大画面の場合、コメント欄が横幅1440~1600ないと欠けるようになった。マウスをコメント欄の上に載せれば動画の上にかぶさる形で出てくる。 あと再生ボタンもでかい。マイリストボタンが上部の大きいボタンになった。 このプレイヤーはとにかく、色々でかい。 情報整理 動画の概要(動画説明)が基、収納されるようになった。再生数・コメント数が動画の下に落ちる。動画説明も下に存在している。動画説明を見ようと思えば、動画上部をクリックして展開するか、スクロールすれば良い。 ファーストビューで数字を見せないようにする工夫か。数字で動画を判断するまえに動画を見てもらいたい、という流れ?それとも動画を上部に持っていきたいから、か

  • http://blog.monoweb.info/article/2011050321.html

  • 1