prefers-reduced-motionでアニメーション（視差効果）を減らす設定をしたデバイスに対応させる
2023年2月7日 CSS, アクセシビリティ アニメーションのあるWebページって、見るのも作るのも好きなんですが、みなさんはいかがでしょう？中には動きが苦手で目が疲れてしまう、画面酔いしてしまう…なんていう方もいらっしゃるかと思います。今回はアニメーションが苦手な方のためにWebサイト側でできることを考えてみます。 ↑私が10年以上利用している会計ソフト！ アニメーションを減らす設定 アニメーションによって画面酔いしてしまったり、動きがつくと内容が理解できなくなるという方は、OS側で視覚効果を減らす設定をしているかと思います。そういった設定をしている場合は、CSSでWebサイトのアニメーションもなくす、あるいは軽減させる指定が可能です。 設定方法 まずはアニメーションを減らすためのOS側の設定方法から紹介します。 Windows 10: 設定 → 簡単操作 → ディスプレイ → アニメ
jQuery-plainModal
Download TAR.GZDownload ZIPView on GitHub Recommend: PlainModal instead of "jQuery-plainModal" No dependency, Modern browsers supported, Lightweight & Single file, and more features The simple jQuery Plugin for fully customizable modal windows. plainModal has basic functions only, and it does not style. It has no image files and no CSS files. Just one small file. Open Sample jQuery.plainModal Not
レスポンシブ対応サイトを作成する超軽量のスクリプト -skel.js | コリス
スタンドアローンで動作する19KBの超軽量スクリプト。 さまざまなレイアウトに対応できるグリッド。 表示サイズごとのブレイクポイントの設定も簡単。 resetやbox-modelなどの有用なCSSのショートカットを用意。 プラグイン機能も備えているので、拡張にも対応。 skel.jsのデモ デモはシンプルな構成のページが表示が用意されています。 まずはデスクトップサイズとして、幅1200pxで表示してみます。 デモページ：幅480pxで表示 skel.jsの使い方 jQueryや他のスタイルシートなどを用意せずに、すぐに利用できます。 Step 1: 外部ファイル 当スクリプトを外部ファイルとして記述します。 <script src="skel.js"></script> jQueryもスタイルシートも他のファイルは必要ありません。 Step 2: スクリプトのセットアップ スクリプトのセ
ブログを58の言語に瞬時に対応させるWordPressプラグイン「GTranslate」:phpspot開発日誌
WordPress GTranslate WordPress Plugins ブログを58の言語に瞬時に対応させるWordPressプラグイン「GTranslate」。 Google翻訳のAPIを使い、ページを５８の言語に対応させます。驚くべき部分は、Ajaxを使い画面遷移なしで、ブログそのままを瞬時に翻訳してくれるところ。 更に一度設定すればクッキーを使って設定が保存され、別のページに移動したとしても自動でページが翻訳されます（記事だけでなくナビゲーションも全て)。 インストール＆設定すると次のような言語選択ウィジェットが追加できます。 設定方法 インストールして、有効にすると、「設定」→「GTranslate」の項目が現れますのでクリック。 設定画面ではデフォルトの言語を「Default Language」→「Japanese」を選択して日本語に設定しましょう。 また、選択する言語が
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Responsive Image Maps jQuery Plugin
