スマートフォンからアクセスした時だけJavascriptを適用する | Wakana.me
スマートフォンやタブレットから見た時だけ、Javascriptを適用したいシーンがありました。 まぁ具体的にはjQueryなんですが。 CSSはMedia Queriesで分けるとして、どうすればいいかしらん。 と思っていたら、あっさり解決。 最初にwindow widthを取得すればいいのねん。 私の場合は、タブレットとスマートフォンへの挙動を同じにしているので、 1024px以下の場合は同じ処理を適用しています。 javascript $(document).ready(function(){ if ($(window).width() < 1024) {//ウインドウサイズが1024px以下ならば $('#id').click(function() {//#idをクリックした時にイベントを適用 //sample script ほげほげ } }); サンプルなんで別に何か動くスクリプト
IEの異なるバージョンごとにスタイルシートを適用する方法のおさらい
CSSやJavaScriptを使って、IE6, IE7, IE8, IE9 とIEの異なるバージョンごとにスタイルシートを適用する方法のまとめを紹介します。 Use Different Styles For Different Internet Explorer Versions [ad#ad-2] 下記は各ポイントを意訳したものです。 CSS: 条件付きコメント(class) CSS: 条件付きコメント(外部スタイルシート) CSS: CSS Hack JavaScript JavaScript: jQuery おまけ CSS: 条件付きコメント 条件付きコメントを使用して、ドキュメントの一番上の要素(html)にIE6/7/8用のclassを付与します。 HTML <!--[if IE 6]> <html class="ie6"> <![endif]--
【HTML5】新規でサイトを作るのに使えそうなの一式。Ver 1
HTML5版の新規でサイトを作るのに使えそうな一式です。 今までの新規で使えそうな一式のVer3からも有る程度流用はしていますが、結構いじってます。 今までみたいに、社内のマークアップエンジニアとかそういう人がもう居ない環境なので、何処かで使われていた訳ではありませんが、まー最初の準備って地味に面倒なのでちゃちゃっと始めるには良いんじゃないでしょうか。 【HTML5】新規でサイトを作るのに使えそうな一式。Ver 1をDL（zip：12kb） HTML5版のVer 1を見る 社内のマークアップエンジニアとかって書いたら、これどうなのよ？とか話してた頃がちょっと懐かしくなった。 コーダー飲みとか、CSS Niteなんかで、マークアップエンジニアやコーダーさんと会う機会は結構有るのに、そういう具体的な？話まではしないからなぁ・・・ それはさておき、中身のご説明などを続きにて。 中身のご説明 zi
演算子 - とほほのWWW入門
変数 var に値 exp を代入します。イコール(=)は等しいという意味ではなく代入するという意味を持ちます。 xx = 5; // xx に 5 を代入する yy = xx; // yy に xx の値(= 5)を代入する zz = "ABC"; // zz に文字列"ABC"を代入する 例えば、次の例を数学的に解釈すると「解無し」となってしまいますが、JavaScript ではこれを「xx という変数に、xx の値と 2 を足したものを代入する」という意味になります。あらかじめ xx に 5 が代入されていれば、xx は 7 となります。
IFRAMEの高さを内容に応じて変えるには？(クロスドメインで) - 風柳メモ
瞬語一覧をブログパーツ化しようとして、はまる 先日の瞬語一覧を、とりあえずお手軽にGoogle Gadget化してみるか……と安直に考えて、はまってしまいました。 瞬語一覧 - “今”話題のキーワードって？は、タグクラウドっぽい表示にしている性質上、コンテンツの高さが変わってしまうことは避けられません。 で、調べてみたら、Google Gadgetにはdynamic-height Libraryの中に、_IG_AdjustIFrameHeight()という関数が用意されており、ガジェットの高さを調整してくれるみたいです。 なんだ、簡単じゃんと思ってやってみたのですが……。 試してみたい方は→こちら。 _IG_AdjustIFrameHeight()の問題点 サイズ調整動作が鈍い（IFRAMEの内容が読込まれてから高さ調整までに一拍置かれる感じ)。 動作が不安定（サイズ調整してくれないときが
JavaScript/ウィンドウ/サブからメインウィンドウを操作する - TAG index
サブウィンドウ内のアクションで、メインウィンドウ（親ウィンドウ）を操作するスクリプトです。 （例：サブウィンドウ内のリンクでメインウィンドウ内のページを切りかえる） メインウィンドウのソース <html> <head> <title>TAG index Webサイト</title> <script type="text/javascript"> <!-- // サブウィンドウを開く処理 function disp(url){ window.open(url, "window_name", "width=250,height=350,scrollbars=yes,resizable=yes,status=yes"); } // --> </script> </head> <body> <p><a href="example_sub8.html" target="window_name" on
403 Forbidden
＼閉鎖予定のサイトも売れるかも？／ アクセスがないサイトもコンテンツ価値で売れる場合も… ドメインの有効期限を更新してサイト売却にトライしてみましょう
border-radius.js - Javascriptライブラリ - HTML5.JP
border-radius.js は、class属性に値を追加するだけで、ブロックボックス要素の角を丸くするライトウェイトなJavaScriptライブラリーです。 CSSでborderとmarginを指定し、class属性に "html5jp-border-radius" を追加するだけで、角が丸くなります。JavaScriptのコードは一切必要ありません。また、このライブラリーは単独で動作するため、他のJavaScriptフレームワーク等を読み込む必要もありません。 このライブラリーは、指定のブロックボックス要素の上下に角を追加します。Internet Explorerの場合はVMLを、それ以外のブラウザーではCanvas（Canvasがサポートされていれば）を使っています。 ダウンロード Release Date Size (byte) Download
IE6以下をWeb標準に準拠させるライブラリ『IE7.js』
IE6以下をWeb標準に準拠させるライブラリ『IE7.js』 多くの人が待ちに待ち望んだライブラリ。やはりすごい人はすごいものを作るんですね。 このライブラリを読み込むことによりIE6以下でもIE7と同じようなXHTM/CSSの解釈を行ってくれます。 ただし完全にIE7と同じような形にするのではなく、より近い形ということです。 現在公開されているバージョンはversion 2.0 (beta)ということで、まだ実務で使うのは難しいかもしれませんが、MITライセンスで公開されておりますので正式にリリースされればweb制作の現場を変えてしまうライブラリです。 設置方法 Google コードのie7-jsより直接読み込むことが可能です。 以下の要素をhead要素内などに記述します。 <!--[if lt IE 7]> <script src="http://ie7-js.googlecode.c
Javascriptについての質問です。 複数の画像（それぞれにリンクつき）をリロードごとに「順番に」切り替える方法を教えてください。…
Javascriptについての質問です。 複数の画像（それぞれにリンクつき）をリロードごとに「順番に」切り替える方法を教えてください。 ランダムに切り替える方法は探せたのですが「順番に」切り替える方法がわかりません。 よろしくおねがいいたします。
JavaScriptで背景画像を順番に表示することはできるでしょうか？ランダムで表示は沢山見かけるのですが、順番は全く見つ... - Yahoo!知恵袋
JavaScriptで背景画像を順番に表示することはできるでしょうか？ ランダムで表示は沢山見かけるのですが、順番は全く見つからず・・・ お時間があれば回答お願いします。 JavaScriptで背景画像を順番に表示することはできるでしょうか？ ランダムで表示は沢山見かけるのですが、順番は全く見つからず・・・ お時間があれば回答お願いします。
Spice Street （jQuery）画像をランダムに表示させる
（jQuery）画像をランダムに表示させる 2009/12/30 16:38 当該ページを表示させる度に違った画像をランダムに表示させる手法はよくあるが、今まで使ったことがなかったのでネットで調べてみた。その中で一番やりやすかったものを少々アレンジして備忘しておく。 scriptはどこを見ても似たようなパターンで、今回は以下のコードを打ち込み.jsファイルで別ファイルに保存しておく。例によってコードの意味はよくわからないが適当に推測して変更すべきところは変更してみた。ファイル名をここでは仮に「random.js」としておく。 function random(){ var image=new Array() image[1]="（表示させる画像1への相対パス）" image[2]="（表示させる画像2への相対パス）" image[3]="（表示させる画像3への
IE5～8をCCS3の疑似セレクタ対応にするスクリプト - ie-css3.js
CSS3に対応していないIE5/6/7/8をCSS3の擬似セレクタに対応させるスクリプトを紹介します。 ie-css3.js 対応するセレクタは、下記の11種類です。 :nth-child :nth-last-child :nth-of-type :nth-last-of-type :first-child :last-child :only-child :first-of-type :last-of-type :only-of-type :empty スクリプトの動作は、セレクタを見つけたらシミュレーションしたものに変更されて適用されている、とのことです。 スクリプトの使用方法は、DOMAssistantと併用し、外部スクリプトとして記述します。 <textarea name="code" class="html" cols="60" rows="5"> <head> <script t
IEでlabel内の画像をクリック可能にする - os0x.blog
ウノウラボ by Zynga Japan: IEでlabelの子要素に画像を含めるをより汎用的に実装してみます。 まず、修正方針は以下の2点。 HTML側に処理を書かない(onclickは使わない) IEだけで処理されるようにする 素直に書いてみるとこういった感じになります。 /*@cc_on window.attachEvent('onload', function(){ // まず、label内の画像に自分がクリックされたらlabelにクリックを投げる関数を定義する var label_img_enclick = function(label) { var imgs = label.getElementsByTagName('img'); for (var i = 0, l = imgs.length;i < l; ++i) imgs[i].attachEvent('onclick',
[IE]labelの子要素にimgを使う - Tany The World
（IE）labelを貼った画像をクリックしても動作しない。 なのでJavaScriptで逃げる方法。 <input type="radio" name="imgid" id="id1" value="1" /><label for="id1">id1<br /> <img src="x.gif" onclick="document.getElementById('id1').click();" alt="img1" /><br /></label> <br /> <input type="radio" name="imgid" id="id2" value="2" /><label for="id2">id2<br /> <img src="x.gif" onclick="document.getElementById('id2').click();" alt="img2" />
ウィンドウサイズに合わせてCSSを変更できるdynamiclayout.js
ウィンドウサイズに合わせてCSSを変更できるdynamiclayout.js Dynamiclayout.jsはウィンドウサイズに合わせて読み込むCSSファイルを変更できるJavaScriptライブラリになります。 dを使用することにより、リキッドイアウトの幅を広げることが可能です。 設置方法 ダウンロードしたdynamiclayout.jsをhead要素などで読み込みます。 <script src="./dynamiclayout.js" type="text/javascript"></script> ウィンドウ幅に合わせたCSSファイルを用意します。 それぞれのCSSファイルを読み込む際にはtitle属性に ウィンドウ幅が750pxまでの場合の『thin』 ウィンドウ幅が950pxまでの場合の『wide』 ウィンドウ幅が950pxより大きい場合の『wider』 を付けて読み込みます。
親窓へリンクを渡す小窓（サブウインドウ）を作る方法 [ホームページ作成] All About
親窓へリンクを渡す小窓（サブウインドウ）を作る方法小窓から親窓の表示ページを切り替えるテクニックを使って、ナビゲーション用の「リモコンウインドウ」を作成してみましょう！ 小窓から親窓へリンクを渡す方法は、様々な場面で活用できます。実現は非常に簡単！ サブウインドウからメインウインドウを制御 スクリプトを活用すると、右図のように、「サブウインドウ」（小窓）から、「メインウインドウ」（親窓）の表示ページを切り替えることができます。 これを活用して、ナビゲーション用（メニュー用）のサブウインドウ（小窓）を開いて、そこからのリンクで、メインウインドウ（親窓）の表示ページを切り替える仕組み「リモコンウインドウ」を作ってみましょう。 今回は、この「リモコンウインドウ」を実現する方法をご紹介致します。 実現にはJavaScriptを使うのですが、とても簡単にできます。 サブウインドウを開くには？ まずは
![親窓へリンクを渡す小窓（サブウインドウ）を作る方法 [ホームページ作成] 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)
JavaScriptで階層型プルダウンメニュー - Good Sleep｜Webデザイナーの日々のスキマ
Ajaxで作る階層型メニューバー｜SpryMenuBar.js 以前、「JavaScriptでプルダウンメニュー（DropDownMenu.js）」という記事をこのブログで紹介しました。するとこの前、階層を増やしたサンプルはできませんか？という問い合わせがあり、試しに作ってみたしだいです。 以前プルダウンメニューを作る際、実は右の本に出ていたSpryMenuBar.jsを使って作ろうと思っていました。ただ、CSSの設定が結構複雑でちょっと触るとレイアウトが崩れてしまうし、ウチの環境では、IE6で２階層目のメニューがズレて表示されてしまうので、別の方法で作りました。それが前回のDropDownMenu.jsを使った方法です。 しかし、DropDownMenu.jsで３階層目を作ろうとした所、結構大変だという事が分かり、もう一度、SpryMenuBar.jsに挑戦せざるを得なくなりました。 S
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
window.location でTARGETの指定はできますか？
jsScrollbar