JavaScript でテキストをクリップボードへコピーする方法
document.execCommand('copy')ただしこの処理には前提条件があって、コピーされるのは「処理実行時に画面上で選択しているテキスト」に限られます。つまりこのメソッドだけでは、任意の文字列をコピーさせることはできないのです。 そこでこの機能を拡張して、引数で渡した文字列を擬似的に選択状態にしてコピーさせる関数を用意しました。 JavaScript で任意のテキストをクリップボードにコピーする関数この関数を実装する上でのポイントは、裏で文字列を選択するためのコピー用テキストエリアを一時的に作ることです。ここにコピー対象文字列を出力し、JavaScript で選択状態にすれば冒頭のコピーメソッドを実行することができます。 そしてコピーが完了したら、作成したテキストエリアを削除します。プログラム処理においては一瞬の出来事なので、画面上にテキストエリアが表示されるのを目視すること
スマホ版 Chrome のヘッダー部分に色をつけるには meta タグを仕掛ければ良い
スマートフォンでネットサーフィンをしていると、サイトによってアドレスバーの部分が彩色されているページがあることに気付くでしょう。通常はグレーですが、青やらオレンジやら、ページによって様々なカラーが設定されています。 Windows 7 の場合、アイコンのカラーの一部を取り出して、タスクバーのアイコン背景色が設定されます。しかしスマホ版 Chrome の場合は、任意のカラーを取得するのではなく、コードの設定により対応させることができます。 言葉では伝わりづらいので、以下の画像をご覧ください。何をしたいのかと言うと、このアドレスバーのあるヘッダー領域の背景色を変更することが今回の目的です。 パソコン版には対応していないため、設定したコードの確認はスマートフォン上で行う必要があります。 では、実際にどのようなコードを設定するのか、説明していきましょう。 meta タグにテーマカラーを設定する下記
Lazy Load と Edge の相性が良くないので遅延読込みを対象外にした
Windows 10 の利用ユーザーが増え、それに比例するように Micorosoft Edge を利用するユーザーも増えてきました。当ブログのアクセス解析を見ても２％程度ではあるものの、着実に利用者が増えているのを感じています。 最新ブラウザなので、表示における問題はないのですが、WordPress の画像遅延読み込みのプラグインである Lazy Load 利用時に、文章が途中で切れてしまう不具合が散見されました。 F12 キーから開発者ツールを開き、ソースを見る限りは問題ありません。Firefox や Opera で閲覧しても問題ないので、おそらく Edge 特有の問題ではないでしょうか。きちんと表示できるように試行錯誤をしてみると、どうやら画像の遅延読込みをしている処理が不具合を発生させる起因になっていることが分かりました。 画像遅延読込みプラグイン Lazy Load僕が運営してい
フィード（RSS）アイコンを HTML と CSS だけで実装する方法
.feedicon { width: 22px; height: 22px; display: inline-block; position: relative; } .f1, .f2, .f3 { position: absolute } .f2, .f3 { border-top: 5px solid #f49f0f; border-right: 5px solid #f49f0f; } .f1 { background-color: #f49f0f; width: 6px; height: 6px; border-radius: 50%; display: inline-block; bottom: 0; left: 0; } .f2 { width: 9px; height: 9px; border-radius: 0 13px 0 0; bottom: 0; } .f3 { wi
iframe からのアクセスを拒否する .htaccess の設定方法
ヘッダー部分に自身のサイトの情報と広告が掲載され、下部に iframe にて当サイトが表示されている海外のサイトのページを見つけてしまいました。 直接的な被害はないものの、このような表示のされ方は僕としても本意ではありません。リンクを貼ってくれるならまだしも、iframe で表示して自前のコンテンツのような見せ方をしているのが腑に落ちないポイントでした。 このようなサイト偽装されるのは良い気分ではないので、以下の Mozilla developer network のサイトに書かれている内容を参考に、外部サイトから iframe によるアクセスを拒否するように設定することにしました。 .htaccess へ記述して iframe によるアクセスを拒否するMozilla のサイトによると、HTTP レスポンスヘッダに含まれる X-Frame-Options を利用することで、iframe に
初心者向けロリポップのプランの選び方！転送上限100GB/日のスタンダードプランは使い勝手の良いワンコインサーバーか？
初心者向けロリポップのプランの選び方！転送上限100GB/日のスタンダードプランは使い勝手の良いワンコインサーバーか？
【無断転載対策】ブログ記事をパクらせないための対策を仕込み、ようやく転載されなくなった
このサイトとは別に運営しているブログ NJ-CLUCKER の記事が無断転載されていることに気付いたのが、今から 2週間前です。 運営者に直接連絡する術も無く、直リンクの画像を入れ替えてみたり、無理矢理スクリプトファイルを埋め込んで、それごとパクらせて正しく画面表示出来ないようにする等、小手先での対応を行ってきましたが、ようやく転載されないように制御することができたので、その最終報告となります。 これまでの経緯は過去の記事をご覧ください。
WordPress
Web系メインで従事していた元システムエンジニア。現在は個人事業主として独立。Webサイト運営における「困った問題」の解決方法をブログで発信。Web サイト運営、ポップデザインや動画制作など、パソコンでモノづくりをしている。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
jQuery UI の Autocomplete の CSS 設定を上書きする方法