ユーザー操作の一括無効化で役立つ！ HTMLのinert属性の紹介 - ICS MEDIA
HTMLやCSSには、ユーザーインタラクション（ユーザー操作）を無効化するための方法がいくつか存在します。たとえば、マウスやタッチ操作を無効化したいときはCSSでpointer-events: noneを要素に指定するなど、制御したいユーザー操作によってさまざまです。 カルーセルやモーダルなユーザーインターフェイス（UI）では、非アクティブな要素が操作されないように「画面には表示されているが、あらゆるユーザー操作を受け付けない状態」にしたい場合があります。具体的には、以下のユーザー操作を無効化します。 マウスやタッチ操作を無効化したい テキスト選択を無効化したい キーボードフォーカスをあえて無効化したい 音声読み上げをあえて無効化したい 必要なプロパティや属性を複数指定することが考えられますが、そのようなときに役立つのがinertイナートと呼ばれるHTMLのグローバル属性です。 inert
การถ่ายภาพและการท่องเที่ยว - RESPONSIVE
This message appears for administrator users only
【WordPressで文字列を出力する際のエスケープ「esc_html」「esc_attr」の違いについて】｜今村だけがよくわかるブログ
変数に格納された値を出力することはよくあると思いますが、エスケープについては、ちゃんと意識しないといけないですよね。それで、WordPressでよく使う、 esc_htmlesc_attrこれについて、はっきりとした使い分けがあるのでメモしました。お時間がありましたら、ご覧くださいませ。 「esc_html」とはCodex英語版のみ見つかりましたので、引用いたします。Function Reference/esc html Escaping for HTML blocks. ・・・もう少し説明が欲しいところではあります。 「esc_html」の使い方サンプルはこうです。 <?php esc_html( $text ) ?>「esc_attr」とはこちらもCodex英語版から。Function Reference/esc attr Encodes < > & ” ‘ (less than, g
iframeのseamless属性を試してみた
2024年2月1日 拙作プラグインの譲渡について 拙作のMovable Typeのプラグインを、株式会社ワールドイズマインに譲渡いたしました。 長きにわたり拙作のプラグインをご愛顧いただき、ありがとうございました。 以前に、当ブログで「iframe要素のseamless属性」という記事を書きました。 seamless属性の仕様を見た限りでは、Ajaxで要素のinnerHTMLを書き換えるのと同じように、Webページの中に他のファイルからHTMLを流し込むようなイメージになるように読めたので、ぜひ使ってみたいと思っていました。 しかし、その当時は、まだseamless属性に対応したWebブラウザはありませんでした。 久々にseamless属性のことを思い出して、最近はどうなっているか調べてみました。 すると、WebkitのNightly Buildや、Google Chromeのdevブラン
:before, :after擬似要素 の使い方を基本からマスターするためのチュートリアル | コリス
擬似要素はCSS1から存在するもので、ここで解説する「:before, :after擬似要素」はCSS2.1でリリースされたものです。 CSS1では「:first-letter, :first-line」です。 擬似クラス、擬似要素 擬似要素の記述は一つのコロンを使用し、「:before, :after」となります。 コロンを使用するものは他に、「:hover」などの擬似クラス、CSS3ではコロンを二つにした「::before, ::after」などがあります。 サポートブラウザブラウザ 「:before, :after擬似要素」をサポートするブラウザは下記の通りです。 IE8+ Firefox3.5+ Chrome Safari4+ Opera6+ IE8+とすべてのモダンブラウザと言ってよいでしょう。 非サポートブラウザへの対応 IE7にも「:before, :after擬似要素」を利
iframe 要素の seamless 属性を試してみた
WebKit Nightly Buildsが iframe 要素に追加された seamless 属性に対応したとのことなので、早速どんな感じになるのか確認してみました。 Last week in WebKit: Inspector's sources panel and private names ： Surfin' Safari Add seamless layout code (and pass most of the remaining seamless tests) ： Changeset 118291 WebKit 現在公開されている WebKit Nightly Builds の最新版、及び Google Chrome も、開発者向けビルド （Dev channel） の最新版 「21.0.1155.2」 で動作しているのが確認できました。インストール済みの方は下記にデモページ
jQuery Mobileを触りながら覚えよう！ [Japanese Version Only] - jsdo.it - Share JavaScript, HTML5 and CSS
サンプルを用意しました！フォークしてjQuery Mobileを体験してみよう！ スマートフォンサイトをプレビューするには、エディタ画面の「Smart Phone Preview」ボタンをクリックしてください。 こんなことを試してみるとオススメ！ aタグに data-transition 属性を付加するとトランジションのエフェクトを選ぶことができます。 Footer要素を画面下に固定することができます。data-position="fixed" フォーム周りの要素もjQuery Mobileで表示できます！ そもそもjQuery Mobileってなんだっけ？ jQuery Mobileはモバイルサイト構築のためのフレームワークです。 スマートフォンサイトやWebアプリを作成する際に利用します。 非常に手軽に利用でき、少し勉強するだけでそれなりのものが作れてしまうんですよ！ ということで、j
jQuery入門 : 指定したプログラムをsubmitするには
2009 04月02日 修正ボタンなどでフォームデータを送信したい場合、 $(”#フォームのID”).attr(”action”,”postするurl”); $(”#フォームのID”).submit(); で、送信できます。 例） html側 <form id=”form1″ method=”post”> <input type=”button” name=”実行” onclick=”form_submit();” /> </form> javascript側（test.phpをsubmitする場合） function form_submit() { $(”#form1″).attr(”action”, “test.php”); $(”#form1″).submit(); } tips_admin jQuery
HTTP ヘッダーでの rel="canonical" 属性に対応しました
+1 ボタン 2 AMP 11 API 3 App Indexing 8 CAPTCHA 1 Chrome 2 First Click Free 1 Google アシスタント 1 Google ニュース 1 Google プレイス 2 Javascript 1 Lighthouse 4 Merchant Center 8 NoHacked 4 PageSpeed Insights 1 reCAPTCHA v3 1 Search Console 101 speed 1 イベント 25 ウェブマスターガイドライン 57 ウェブマスタークイズ 2 ウェブマスターツール 83 ウェブマスターフォーラム 10 オートコンプリート 1 お知らせ 69 クロールとインデックス 75 サイトクリニック 4 サイトマップ 15 しごと検索 1 スマートフォン 11 セーフブラウジング 5 セキュリティ 1
内部リンクにはnofollow属性を付けなくてよい
「トップに戻る」のリンクにnofollow属性を付けるべきか？ この問いにGoogleのMatt Cutts(マット・カッツ)氏が回答しました。 答えは、「NO」だ。 僕の補足も交えながら説明します。 質問者がどういう意図でトップページに戻るための内部リンクにnofollowが必要かどうか尋ねたのかの理由はこのビデオからでは分かりませんが、原則として内部リンクにnofollowは不要です。 数年前はnofollowでPageRankの流れをコントロールする「PageRankスカルプティング」というSEO手法が存在しました。 しかしこの“テクニック”はすでに役に立たなくなっています。 『nofollow属性をリンクに付けるのはどんなとき？』でも説明したように、信頼できない外部サイトのページにリンクを張るときにnofollowを利用します。 僕のブログでは、たとえばスパム判定を受けたサイトを紹
Movable Typeの日付タグフォーマットの西暦を元号で表示する
Movable Typeの日付タグフォーマットの西暦を元号（昭和・平成）で表示するカスタマイズです。 変換前 変換後 以下、カスタマイズ方法です。 １．西暦を平成に変換する 例えば、ブログ記事の日付の西暦を元号で表示する場合は、次のサブテンプレートを利用してください。 <mt:Entries> <mt:EntryDate format="%Y" setvar="year" /> 平成<mt:GetVar name="year" op="-" value="1988" />年 </mt:Entries> ２．西暦を昭和および平成に変換する 冒頭の画像のように、昭和および平成に対応するには、1989年を境に3種類の判定文で分岐させます。さらに1989年は次のように判定します。 1月7日まで：昭和64年 1月8日以降：平成元年 サブテンプレートは次のようになります。 <mt:Entries> <
PHPで予め許可したタグと属性以外を除去できるライブラリ「kses」:phpspot開発日誌
CSS3のでのボックス要素デザインを圧倒的に簡単化できる「CSS3 Click Chart... 次の記事 ≫：アプリやWEBサイトに使えそうなフリーな244個のアイコンセット kses - PHP HTML/XHTML filter | Download kses - PHP HTML/XHTML filter software for free at SourceForge.net PHPで予め許可したタグと属性以外を除去できるライブラリ「kses」。 外部からの入力値は基本的にhtmlspecialcharsでタグを無効化するのが通常の考え方ですが、掲示板なんかで特定のタグを許可したいという場合があります。 PHPにはstrip_tagsというようなタグを除去しつつ、特定のタグのみを残すという関数が標準であったりしますが、これだと属性までは制御しきれません。 更には、<a href=
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://petitec.com/2012/06/wordpress%E3%81%A7%E5%89%8D%E5%BE%8C%E3%81%AE%E3%83%9A%E3%83%BC%E3%82%B8%E3%81%B8%E3%81%AE%E3%83%AA%E3%83%B3%E3%82%AF%E3%82%92%E3%82%AB%E3%82%B9%E3%82%BF%E3%83%9E%E3%82%A4%E3%82%BA%E3%81%99%E3%82%8B/
seotemplate.biz