株式会社LOUPE エンジニアチームの勉強会「LOUPE Study」の発表資料です。 第一回目の担当は僕。 テーマは「SinatraでのWeb開発について」でした。
JavaScript時代のJava #kansumiB7 #kansumi
株式会社LOUPE エンジニアチームの勉強会「LOUPE Study」の発表資料です。 第一回目の担当は僕。 テーマは「SinatraでのWeb開発について」でした。
jQuery.LazyJaxDavisで静的サイトを手軽にダイナミックにする
programming notes. mainly about JavaScript / jQuery. [@Takazudo] [takazudo@gmail.com] Hint: alt + / jQuery.LazyJaxDavisというライブラリを書いた。このライブラリは、一般的な静的に生成されるようなサイトを、HTML5 history APIの力を使って素敵にダイナミックにします。 このライブラリを使うと、すべてのリンクを、通常遷移の代わりに、Ajaxベースのダイナミックな遷移にします。その際、history.pushStateして、通常の遷移と同じように見せる。言葉にするのは難しいので、実際にサイトを見てもらったほうが分かりやすいと思う。以下のサイトの左ナビをポチポチクリックするなりして。 jQuery.LazyJaxDavis加えて、結構汎用的なURLルーターの機能も備えて
Davis.jsでHistory APIを比較的お手軽に使う
programming notes. mainly about JavaScript / jQuery. [@Takazudo] [takazudo@gmail.com] Hint: alt + / ポチってもうたー開発メモ。 今日、HTML5 History APIの、URLは静的に見えるけどダイナミックにUI変えちゃうよーっていうのを実装してみた。ポチってもうたーをChromeとかFirefoxで見ると、色々遷移するとURLは変わるけど全面リロードは起こらなくなってます。 これを実装するには、HTML5のhistory.pushStateとかhistory.popStateとかいう、historyをいじる仕組みを使わないといけないんですが、その辺をうまいことラップしてくれる Davis.js というライブラリがあったので、これを使ってみました。 Davis.jsの使い方は、基本的にはこ
樱桃视频污视频_樱桃视频每天免费观看三次_樱桃视频免费观看_樱桃视频APP污下载
樱桃视频污视频【jiuseapp.com】是由百度公司研发推广的一款功能强大的短视频手机APP,提供ios苹果下载/安卓下载。百度影音依托百樱桃视频污视频、樱桃视频每天免费观看三次、樱桃视频免费观看、樱桃视频APP污下载，能够让用户找到几乎所有想要寻找的视频资源，是百度影音短视频手机APP,提供ios苹果下载/安卓下载得天独厚的优势，并且支持屏幕截图，还能边下边播。
HTML5のHistory APIを制御するJSライブラリ「Davis.js」
Davis.js - Simple, degradable JavaScript routing using HTML5 pushState. HTML5のHistory APIを、制御するJavaScriptライブラリ「Davis.js」が公開されています。 (英語) ライセンスはMITのようです。
YouTube連続再生をpushStateでパーマリンク化＆戻る対応した。 - 車輪を再発明 / koba04の日記
以前に作ったものは、検索文字列の取得、検索、動画再生をajax的に全てJavaScriptで行っていたので、当然パーマリンクはなく戻るボタンなどで前の検索履歴に戻ることが出来ません。 http://d.hatena.ne.jp/koba04/20110227/1298736386 その対応としてlocation.hashを使った方法などもあるのですが、HTML5ではhistoryオブジェクトのpushStateなどを使ってその辺りをうまく処理することが出来るので今回はそちらを採用しました。 githubで採用されているズババババッっていう感じのカッコいいやつですね。 ChromeとSafariでは確認しましたがその他ブラウザでは動かないかもしれません。 詳しくはWEB+DB PRESS vol.61のYappoさんの連載がわかりやすいので見てください。今回実装したのもほとんど真似させてもら
history.pushStateでページ遷移するjQueryプラグイン書いた - Webtech Walker
history.pushStateでのページ遷移をやりやすくするためにjQueryのプラグインとしてjquery.smarthistory.jsというのを書いてみました。 jquery.smarthistory.js history.pushStateをサポートしてるブラウザではhistory.pushStateを使って、サポートしてないブラウザでは何もしません（普通に遷移する）。今だとchrome、safari、iOS、Firefox4で動くと思います。 こんな感じで使います。 $('a').smarthistory({ defaultData: $('html').html(), target: function() { return $(this).attr('href') }, before: function() { // ajax前の処理 }, change: function
githubのアレ(history.replaceStateとかhistory.pushStateの話) - 愛と勇気と缶ビール
会社で下の記事についてリマインドしてもらって、なんとなく気になっていたことを調べたメモ。 http://webtech-walker.com/archive/2010/12/06160539.html 記事を読んで、history.replaceState(null, "title", "/new.html") とかやると遷移なしでページのcontentも勝手に置き換わるのかなー、だったらあのアニメーションはどこで発火してんだ？とか考えていたがそもそもreplaceStateの動作について勘違いしていた。 要は、次のようなhtml書いてボタンをクリックしても、historyの先頭が置き換わるだけでページ自体には何も起こらない。(ただしlocation.hrefは置き換わっており、reloadすると/replace.htmlにいく) <!DOCTYPE HTML> <html lang="e
GitHub - defunkt/jquery-pjax: pushState + ajax = pjax
pjax = pushState + ajax pjax is a jQuery plugin that uses ajax and pushState to deliver a fast browsing experience with real permalinks, page titles, and a working back button. pjax works by fetching HTML from your server via ajax and replacing the content of a container element on your page with the loaded HTML. It then updates the current URL in the browser using pushState. This results in faste
pjax こそが pushState + Ajax の本命 - punitan (a.k.a. punytan) のメモ
pjaxの前にpushStateとは AjaxとjQueryの説明は不要として、pushStateとはなんぞや。 pushStateを使ってブラウザの履歴に対する操作をし、HTMLの一部のみを書き換える動作でもブラウザの戻る／進む機能を実現できる方法のひとつ。Ajaxなページを再現し、かつURLを見慣れた方法で自然にpermalinkを表現できる。 有名なところではGitHubで使われてるアレ。 hash fragment (/#!/) ブラウザの履歴を機能させるため、URL の fragment (#) を使ってAjaxなページを実現する方法。一時期もてはやされた感があるが、さらなる「#!」URL批判 - karasuyamatenguの日記 など合理的な反論があり、これから導入するのはためらわれるところ。 有名なところではTwitterで使われているあの厄介者。 pjaxとは pjax
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
5509.me