ListenYo!は、YouTubeの音だけを再生してくれるWEBサービスです。動画は再生されませんので、YouTubeで音楽を聴きたいという方に最適です。 ListenYo!の使い方 ListenYo!にアクセスして、…
YouTubeの音だけを再生してくれるWEBサービス「ListenYo!」

URLによって条件分岐させるjQueryの記述方法

jQueryを使って、URLに特定の文字列が含まれているかどうか、もしくはURLそのもので条件分岐させる方法をご紹介いたします。 URLによって条件分岐させるjQueryの記述方法 例えば、URLに「hogehoge」と…
CSSだけで一つの要素に二重の線を引く方法

CSSだけで要素に二重の線を引く方法を紹介いたします。 CSSだけで要素に二重の線を引く方法 HTMLはシンプルにdivのみで説明いたします。 CSSでは、borderプロパティで線を引き、追加でbox-shadowを指…
空の要素に対してスタイルを適用することができる疑似クラス「:empty」

「:empty」はCSS3で追加された疑似クラスで、空の要素に対してスタイルを指定することができます。 例えば、テーブル内の空のセルだけ背景色を変えたり、非表示にしたり、といったことがCSSだけで指定できます。 :emp…
Macで文字をコピペする時に書式なしで貼り付けるように設定する方法

Macに限らず、Webサイト等から文字をコピペすると、そのままだと書式も含めて貼り付けられます。 [command]+[shift]+V で貼り付ければ、書式なしで文字を貼り付けることができますが、単純に [comman…
WindowsでPSDファイルをサムネイル表示できるようになるフリーソフト「SageThumbs」

SageThumbsは、Windowsのエクスプローラーで、PSDファイルをサムネイル表示することができるようになるフリーソフトです。SageThumbsをインストールすることで、PSDファイルを開いて確認しなくても、サ…
jQueryを使ってページ内リンクをスムーススクロールさせる方法

jQueryを使って、ページ内リンクをスルスルっとスムーススクロールさせる方法をご紹介いたします。紹介するコードをコピペするだけで、ページ内リンクをクリックした時の移動が滑らかになります。 jQueryを使ってページ内リ…
ページ内リンクをクリックした時にアニメーションしながら移動させることができるスクリプト「moveTo」

moveToは、ページ内リンクをクリックした時にアニメーションしながら移動させることができる軽量のスクリプトです。jQueryには依存しません。 挙動については、以下デモページをご確認ください。 デモページを見る mov…
display:inline-block;でできた隙間(余白)をなくす3つの方法

CSSで要素の横並びを実現する手法の1つとして、「display:inline-block;」を使う方法があります。 例えば、以下のようなHTMLがあったとします。 CSS側は以下のように指定すれば、簡単にリストを横並び…
指定した色をベースに彩度や透明度などを変化させた色を作成することができるWEBサービス「ColorMe」

ColorMeは、指定した色をベースに彩度や透明度、明度などを変化させた色を作成することができるWEBサービスです。 ColorMeの使い方 ColorMeにアクセスして、ベースの色を指定します。 下部にある「Color…