jQueryの記事一覧プレミアムユーザー限定記事MOONGIFTプレミアムは、月額500円の有料サービスです。iframeのクリックを感知するjQueryプラグインソーシャルボタンや動画などの埋め込みに際してiframeタグを使うのが基本となっています。iframeの中は別サイトとしてセキュリティも切り分けられている気がするのではないでしょうか。やろうと思えばiframe内のクリックを検知できるのです。jQueryを使わない書き方教えますjQuery、便利ですよね。使ってしまうのですが、サイズは肥大化していますし、実際に使うのはそのごく一部でしかなかったりします。そこで参考にしたいのがYou-Dont-Need-jQueryです。その名の通り、jQueryを使わない標準的な記法を教えてくれるプロジェクトです。画像の表示をレスポンシブに変化レスポンシブコンテンツの中で最も扱いづらいのは画像と言えます。バイナリファイルであるために画面の大きさに関わらず同じサイズですし、画面幅の変更に対してレスポンシブに変化することができません。そこで使ってみたいのがResponsifyJSです。jQueryによる動的フォームが作成マーケターの人たちはアンケートフォームを数多く作成します。そんな時に一回一回プログラマに依頼して作成してもらうのでは時間もかかりますし面倒です。formBuilderです。業務システムに使えそうなテーブルライブラリWebベースで業務システムを構築した場合、必ず必要になるのが一覧表です。そこにExcel並の機能が求められます。ソートであったり、フィルタリング、ページネーションが欲しいと要望が出るはずです。それらを一から自作するのは大変です。そこで今回はjQuery-KingTableを紹介します。今時のWebサイトにおいて、多言語対応は必須と言えます。方法は幾つか考えられますが、基本は3つに分けられます。一つはドメインやパスごとに言語を分けてしまう方法、もう一つは閲覧者の情報を見てサーバ側で情報を出し分ける方法です。最後の方法として、Webブラウザ上だけで表記を切り替えるという方法があります。画面の解像度が高まるのに合わせて注目を集めているのがSVGです。これまでのバイナリと異なり、SVGはXMLベースのテキストデータなので縮小、拡大しても綺麗なままです。テキストデータということは、その書き方もデータがすべて読み取れるということです。DrawSVGになります。スマートフォンにも対応した画像切り抜きライブラリスマートフォンやデジカメで撮影した写真は横長、または縦長です。それに対してWebサービスのプロフィールに使う画像は大抵正方形ではないでしょうか。そんな写真を自動で加工すると顔の一部が削れてしまう可能性があります。そこでユーザ自身の手で切り抜きしてもらうのが一番です。昔あった時計でフリップ式があります。数字がパラパラとめくれる仕組みです。1分経つごとにパネルがめくれ上がっていくのが面白く、見ていて飽きないものだった覚えがあります。そんなフリップ式の時計を再現したUIがFlipClock.jsです。時計としての利用以外にも使える可能性があるライブラリです。年表と画像を組み合わせたスライドショーWeb上では多彩な表現が可能になっていますが、それ故に自分のこだわった表現をどう実現したら良いか悩んでしまうことがあります。そこでぴったりの表現ができるオープンソース・ソフトウェアがないか探すこともあるでしょう。Timelinrもそんなソフトウェアの一つです。最近のWebサイトはSPA(シングルページアプリケーション)の流れもあり、縦長になっています。そのため見えているところだけのスクリーンショットではサイトの魅力を存分に出せないのではないでしょうか。いえ縦長のスクリーンショットなんて誰も喜びません。スクロールでヘッダーを表示/非表示ちょっと前までヘッダーをスクロールしても上部に残し続けるのが流行っていましたが、最近はさらに最初はヘッダーを大きく表示して、スクロールするとヘッダーサイズを小さくすると言うタイプが多く見られるようになっています。jQuery製のペイントソフトウェア画像を単にアップロードするだけでなく、ちょっとした装飾を加えたいと思うことがあるかも知れません。通常、そのためにはローカルで加工してアップロードする必要がありますが、画像編集ソフトウェアを用意するのが面倒です。そこで使ってみたいのがwPaintです。jQueryを使ったWebベースのペイントソフトウェアです。wayで同期するjQueryライブラリJavaScriptでUIを作っている場合に問題になるのがDOM操作です。idで指定したり、あるタグの中のHTMLを操作したりするのが非常に面倒です。一カ所で忘れた結果、全体の表示がおかしくなるなんてことも多々あります。そこでReactのように実際の描画を気にせずに画面を作っていけるライブラリに注目が集まっています。GitHub風にテキストエリアへのファイルドロップでアップロード個人的にGitHubでとても好きな機能にテキストエリアに画像をドロップしてアップロードする機能があります。自分でWebサービスを作っていて、画像をアップロードして欲しい場面があったらこういう実装をするだろうなと思える良い機能です。アニメーションしながら表示される大きなモーダルモーダルウィンドウといえばリンクやボタンをクリックした際などに小さく表示されるウィンドウです。スマートフォンなどの画面領域が小さいブラウザの場合、画面全体に広がって表示されます。そんな大きなモーダルをデスクトップやタブレットでも使えるのがanimatedModal.jsです。正規表現を使ったテキストハイライト正規表現を使いこなせればコード量も大幅に減る可能性がありますし、全体の見通しも良くなります。ミスすると怖い時もありますが、それだけに普段から練習して問題ない正規表現が書けるようになりたいものです。そこで試してみたいのがjQuery.highlightRegexです。シンプルなインタフェースのイベントカレンダーイベントカレンダーは便利です。好きなアイドルグループのイベント、本の出版日、勉強会など様々な場面で使われます。普段使っているスケジューラーに登録しても良いですが、仕事とプライベートのものがごちゃ混ぜになってしまうのを嫌う人も多いのではないでしょうか。URLをアプリ用スキーマに変換iOSではアプリ間で連携する際に専用のURLスキーマを使います。それによりWebブラウザでリンクをクリックした時に電話をかけたり、SMSを送信する、さらには他のアプリを起動できるようになっています。専用だけあってURLをデスクトップ/スマートフォンで切り替えるのは面倒です。GitHubリポジトリを格好良く埋め込み表示ブログや自分のWebサイトでGitHubのリポジトリを紹介したいと思うことがあります。リンクだけでは面白くありませんので、今風に埋め込み表示にしたいところでしょう。${article.post_date_view}${article.post_title}${article.except_content}プレミアムでしか読めない記事が722あります。blockworks。