IT the Best

はてなブログのカスタマイズ情報を中心に、WEBデザインからJavaScriptまでWEB系の開発情報を発信します。便利ツールや暇つぶしのゲームなど開発物も公開します。

slideToggle() - たった1行でできる表示/非表示の切り替え | jQuery Introduction

slideToggle()slideToggle()メソッドはHTML要素の表示/非表示を切り替える時に使います。1行だけで表示/非表示を切り替えることができるのでとても便利です。...jQueryの設定方法 - jQueryを使用するまでの手順 |【jQuery】 - IT the Best...$("tag.classna…

jQueryの設定方法 - jQueryを使用するまでの手順 |【jQuery】| 【JavaScript】

jQueryとはJavaScriptコードをより容易に記述するためのもの。 jQuery使用方法読み込み外部から読み込む方法(CDN)jQuery:Google:Microsoft:「jQuery(公式)」「Google」「Microsoft」が公開しているjQueryファイルを読み込んでjQueryを使用します。三つの…

toggleClass() - 条件式を書かずにクラスの追加/削除をする | jQuery Introduction

toggleClass()このメソッドは、引数に指定されたクラスの追加または削除を行います。条件式を書くことなく容易にクラスの切り替えができます。例クラス"sample2"の追加と削除(クラスの切り替え) 追加$("div.sample1").toggleClass("sample2")

opacity - 透明度を変更し画像などをぼかす -hover処理あり- | CSS Introduction

opacityCSSのopacityプロパティはHTML要素の透明度を変更することができ、画像にぼかしをいれたり透明にしたりすることができます。マウスオーバー時に画像をぼかすことで、画像の強調表示も可能です。opacity: 透明度(0.0~1.0); ...見本、例(html,css)あり.…

transform:scale() - マウスホバー時に写真などを縮小/拡大する | CSS Introduction

transform:scale()関数をマウスホバー時に設定して写真などの要素を強調表示させる。transform:scale()transformプロパティのscale()関数は、要素の大きさを水平方向と垂直方向に対して変更することができます。要素をマウスホバー時に拡大/縮小することで強…

【サンプルあり】リアルタイムに値を取得/表示するスライダー(レンジバー) -コピペ可能- |【HTML】【JavaScript】

スライダーの値をリアルタイムに取得HTMLのinput要素のtype:rangeは、スライダーによる数値の指定ができます。スライダーの値(value)をリアルタイムに取得して表示させる方法を、HTMLとJavaScriptで書き記しました。JavaScriptにjQueryを使用しています。(…

GoogleAdSense広告のコードを改変してレスポンシブ対応にする方法 |【Google AdSense】

GoogleAdSense(グーグル アドセンス)広告を固定サイズで掲載すると画面サイズ(ページレイアウト)に応じたレスポンシブサイズでなくなり、画面からはみ出したデザインになる可能性があります。当記事は、それを防ぐためにGoogleAdSenseの固定サイズの広告ユニ…