Dropboxも採用！JSだけでPDFをレンダリングできるPDF.jsにしびれた！
WebアプリでPDFを扱うときって、どうしています？ 一昔前ならサーバーサイドで生成してAdobe Readerで表示させるぐらいでしたが、いまならJavaScriptだけで描画も制御できちゃうんですね。 本記事はJani Hartikainen、Florian Rappl、Jezen Thomas、Jeff Smithが査読を担当しています。最高のコンテンツに仕上げるために尽力してくれたSitePointの査読担当者のみなさんに感謝します。 現在のブラウザーはほぼすべて、WebサイトでのPDF文書を閲覧できる機能を最初からサポートしています。しかし、開発者はこのもともと備わっている機能を制御できません。たとえば、Webアプリ側のルールでPrintボタンを無効にしたい場合、有料会員への移行ページだけをレンダリングしない場合などを考えてみます。embedタグを使えばブラウザーにもともと備わ
3Dデータ(Blender)をThree.jsで表示するまでの方法 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
おはこんばんにちは。 最近、懐かしのアニメを見ることにはまっています。ハルです。 今回は、「3D表現がしたい！」と思い、 こんな感じの3D表現を、Blender で作成したデータを簡単に書き出して Three.js で簡単に表示させる方法をまとめてみました。 今回の完成ファイルをGithubに公開しています。よろしければ参考にしてください。 完成ファイル：https://github.com/hal-satoyuki/sample3d 完成ページ：https://hal-satoyuki.github.io/sample3d/ それでは早速、作っていきましょう！ 今回の動作確認ブラウザについて 動作確認のブラウザには、Firefox を使います。GoogleChrome で確認すると、XMLHttpRequest のエラーが出てしまうためです。 また、手順については、MacPC での説明を
私がscriptタグについて知っていること全て : 知られていない属性や実行順序など | POSTD
<script src="//typekit.com/fj3j1j2.js"></script> <!-- This second script won’t execute until typekit has executed, or timed out --> <script src="//my.site/script.js"></script> ローカルスクリプトとリモートスクリプトを組み合わせても同様に操作することができます。 機能的には、Webページの前の部分で重いスクリプトのロードがあると、サイトの表示が明らかに遅くなることを意味します。さらに、ページの最後の方で表示されるスクリプトは、それまでに存在するされたスクリプトの動作に依存することを意味します。 先行する全てのscriptタグがロードされ実行されるまで、ページ上の要素は表示されません。つまり、パフォーマンスへの悪影響を覚
[JS]極シンプルなマークアップで、コンテンツを横にスライドさせナビゲーションを表示するスクリプト -Slideout.js
ダウンロードファイルのデモ Slideout.jsの使い方 Step 1: 外部ファイル 当スクリプトとスタイルシートを外部ファイルとして記述します。 <head> ... <link rel="stylesheet" href="index.css"> </head> <body> ... <script src="slideout.min.js"></script> </body> Step 2: HTML ナビゲーション（#menu）とコンテンツ（#panel）を実装します。 idは変更可能です。 <nav id="menu"> ナビゲーション </nav> <main id="panel"> コンテンツ </main> Step 3: JavaScript オプションを定義し、スクリプトを実行します。 <script> var slideout = new Slideout({ '
![[JS]極シンプルなマークアップで、コンテンツを横にスライドさせナビゲーションを表示するスクリプト -Slideout.js](https://cdn-ak-scissors.b.st-hatena.com/image/square/1b5913f9bdd8179129a0b710a9473540ea14fc5c/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201501%2F2015030902.gif)
[JS]非常に少ないコードでパララックスのエフェクトを実装できるスクリプト -Parallaxor
指定した要素をスクロールに応じて、さまざまな方向に異なるタイミングでアニメーションさせることができるjQueryのプラグインを紹介します。 Parallaxor -GitHub Parallaxorのデモ Parallaxorの使い方 Parallaxorのデモ デモはChrome, Firefox, Safariでご覧ください。 IEやスマフォではスタティックに表示されます。 demo: second Parallaxorの使い方 Step 1: 外部ファイル 当スタイルシート・スクリプトとjquery.jsを外部ファイルとして記述します。 <head> ... <link href="parallaxor.min.css" rel="stylesheet"> </head> <body> ... コンテンツ ... <script src="http://code.jquery.com
![[JS]非常に少ないコードでパララックスのエフェクトを実装できるスクリプト -Parallaxor](https://cdn-ak-scissors.b.st-hatena.com/image/square/d9ead73de963a2e762fa0becb8a28dab2b49e44e/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201501%2F2015011904.png)
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
2014年チェックしておきたいスタイルシートやスクリプトのスゴ技たち -Top Pens of 2014
