挙動が大事！ JavaScriptでWindow.closeする時のブラウザ別対応まとめ - TechNote
社内用のWebシステムにこれまで設置してなかった「閉じる」ボタンを設置することになった際、少々ブラウザ問題でつまずいた点があった。ググっても最近のwindow.close周辺の情報を見つけることができなかったのでまとめておく。 photo credit: flod via photopin cc １．まず、閉じるボタンの必要性 ２．IE（シェア：57.8%） ３．Firefox（シェア：18.9%） ４．Chrome（シェア：16.0%） ５．safari（シェア：5.6%） ６．まとめ あわせて読みたい ※ちなみにバージョンはie10、firefox26.0、chrome 31、safari 5.1.7です。 １．まず、閉じるボタンの必要性 ブラウザには標準で×（閉じる）ボタンがついているのに、どうして閉じるボタンを自作する必要が生じるのか？ 一般的には、システム終了のタイミングで何らか
SyntaxHighlighterでソースを読みやすく掲載する方法 [ホームページ作成] All About
HTMLやCSS、JavaScript、PHPなど様々な言語のソースコードを、ウェブ上で読みやすく表示してくれる「SyntaxHighlighter」というツールがあります。JavaScriptとCSSで作られており、右図のように、行番号を付けて綺麗に装飾し、ソースを見やすく表示してくれます。また、ソース部分だけを一括コピーしやすくする機能もあり、便利です。 この「SyntaxHighlighter」は、IT系の技術解説サイトなどでもよく使われているので、目にしたことのある方々も多いのではないでしょうか。標準の配色（テーマ）のほか、右図のように様々な配色が用意されており、好みのデザインで表示できます。CSSを編集すれば、自分で配色セットを作ることもできます。 今回は、ウェブ上でのソース表示に便利な「SyntaxHighlighter」について、そのメリットと使い方をご紹介致します。 Syn
![SyntaxHighlighterでソースを読みやすく掲載する方法 [ホームページ作成] All About](https://cdn-ak-scissors.b.st-hatena.com/image/square/8f530daf3cb408d6b6a0ba6f38ed7ccece36cffc/height=288;version=1;width=512/https%3A%2F%2Fimg.aacdn.jp%2Faa%2Fcommon%2Fogp300_300.png)
いい加減、<script src="http://.. と書くのはやめましょう - DQNEO起業日記
外部サイトのJSファイルを読み込むときに、こういう書き方するのはやめましょう。 <script src="http://example.com/js/jquery.js"></script> 理由 あなたのサイトが、いつの日かSSLに対応することになったとき、そのscriptタグがバグの原因になります。 ご覧のとおり、HTTPSページの中でHTTP要素を読み込もうとすると、ブラウザによっては安全装置が働いて読み込んでくれないのです。 上の例ではjQueryの読み込みに失敗していますが、エラーメッセージ「Uncaught ReferenceError: jQuery is not defined 」を見てもHTTPS/HTTPのプロトコルが原因だとはすぐ気づかないので、わかりにくいバグになってしまいます。 結論 JSファイル(とかCSSとか画像とか)を読み込むときは、"http:"の部分を省
iPad Safari - Overflow Problems Investigation
iPad Safari - Overflow Problems Investigation The following is a scrollable div. If you're in multi-touch Safari (which I have been informed is technically called Mobile Safari), note the absence of scroll bars. But at least you can 2-finger scroll it: <div align="center" style="border:1px solid black; height:200px; width:600px; overflow:auto;"> <h3>Scrollable Div</h3> <img src="/library/images/un
『iPadだとiframeが伸びるのに対応した』
今までうちの会社で制作してきたwebサイト（直接自分が関わった物も含む）では、 多くの場合、新着情報やイベント情報などを、別ファイルで管理し、iframeでindex.htmlに表示させてきた。 エンジニアさんのシステムとの兼ね合いもあり、その方が制作、管理、運営が楽だったからだ。 ●問題点 しかし、iPadの登場で問題が発生してしまった。 iPadではiframeにスクロールバーが表示されずに、読み込んだhtmlの内容に応じて伸びていってしまう。 テーブルレイアウトなら、後続の要素が下がっていってしまうし、 overflow:hiddenが設定されたボックス要素内だと、はみ出た領域は表示されないし、スクロールもできない。 ●解決法 http://www.luigibox.com/00_lab/iframeForiPadSafari/ divでiframeを囲む。 javascriptでi
リンクのようなボタンを作る: Days on the Moon
こんばんは、JavaScript Advent Calendar 2010、15 日目担当の nanto_vi (なんと) です。12 月 15 日が何の日か調べてみると東北本線が宮城県に到達した日とのこと。当時は上野から仙台まで 12 時間 20 分かかったそうです。それから 123 年を経た現在では同じ時間で鹿児島中央から新青森まで行けるようになり、鉄道の速度にも JavaScript の実行速度にも日進月歩を感じる今日この頃です。 さて、アプリケーションを作っていると、見た目はリンクのようだがリンクでない UI 部品を使いたくなるときがあります。ここで「リンクでない」とは、クリックしてもページ遷移が発生しないということです。このような UI 部品は、ページ遷移の代わりにメニューの表示といった何らかのアクションを引き起こす、すなわちボタンとして振舞います。 ユーザーインターフェース記述
TwitterやFacebookのURLには、なぜ#!が含まれるのか (SEOとAjaxのおいしい関係) - kazuhoのメモ置き場
Ajaxを使うためにはページ内リンク (hash fragment=URLの#以降) を使うのが一般的*1 hash fragmentはサーバに送信されないから、JavaScript非対応のブラウザだと動作しない 特にサーチエンジンのクローラ等で問題になる*2 そこで Google は、#! が含まれる URL を hash を含まないものに読み替える仕組みを提唱している。例えば「www.example.com/ajax.html#!key=value」のサーチエンジン用URLは「www.example.com/ajax.html?_escaped_fragment_=key=value」になる。 TwitterやFacebookはこの仕様に従うことで、Ajax な UI と SEO を同時に実現している、というわけ。ということを調べたなう。 参照: Getting Started |
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
