WordPressアップデートによるテーマファイル構成の不具合により、現在は仮のテーマで表示しています。
記事など読みづらいところが多々あると思いますがご了承いただけると幸いです。
鋭意修正中です…

jQueryとHTML5でページのHTMLソースをモーダルウィンドウで表示する「Make a ‘View Source’ Button」

通常、Webページ上のソースを見る際には、
ブラウザ操作から「ソースを表示する」をいったメニューを選択しますが、
ページ上に設置したボタンをクリックさせることで、
表示しているページのHTMLソースをモーダルウィンドウ風にポップアップにて表示することができる
「Make a ‘View Source’ Button」がちょっとおもしろそうだったのでメモ書きしておきます。

Make a ‘View Source’ Button


Make a ‘View Source’ Button | CSS-Tricks


デモはこちら

デモページでは「Fancy View Source」と題したボタンを用意し
クリックすることでポップアップ画面にてHTMLソースが表示されます。

サンプルでは「Primitive View Source」と明記したボタンも用意されていて
こっちはクリックするとページが切り替わる要領でソースを表示する構成になっています。

あまり通常のサイトでは実装する機会が無いかもしれませんが
HTMLのサンプルを紹介する様なページなどで、
この様な仕組みがあるととても便利にも思えます。

ご参考までに。。。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です