【コピペコード有り】後から追加した要素にイベント発生させる方法

クリックしても動かない!どうする??

appendイベントやbeforeイベントで、後から追加されるHTML要素。

jQueryのプラグインなどに良くある形態です。

そして上記の追加要素にクリックイベントを設定したいケースってあると思います。

で、「よし、ググったところonメソッドなら大丈夫なんだな」と思って、「$(’selector’).on(’click’, function() 〜」と記載。

しかし、該当要素をクリックしても何も反応しない!

一体、何がいけないのでしょうか?

記事の続きを読む

子テーマって何?【WordPressカスタマイズ基本編】

今さら聞けない!子テーマについて。

WordPressでサイト・ブログを作成するとき、既に制作済みのテーマを使用することが多いと思います。

さらに一般的には、そのテーマを目的に合ったデザインなどにカスタマイズして使用することになるでしょう。

その際に便利なのが、子テーマと呼ばれる仕組みを活用することです。

今回は「子テーマとは何か?」および、その作成手順について解説します。

記事の続きを読む

Facebookライクボックスの横幅をスマホサイズ100%に!

LikeBoxはみ出してませんか?

fb-likebox

フェイスブックページを運営されている方なら、通常WEBサイトにライクボックスを設置されていると思います。

ただ、サイトをいわゆるレスポンシブデザインにされた場合、ブラウザ幅を狭く(=スマホなどで表示)した際に、ライクボックスが横にはみ出してしまうことが多々あります。

これは、LikeBoxを構成しているパーツの横幅が、px指定で固定されているせいです。

そんな場合、スマホ表示用のCSSに、次のソースを追記してみていただければと思います。

記事の続きを読む

表現が広がる!疑似要素・疑似クラス一覧【CSS1&2編】

この基本、見落としてない?!

part3-css

CSSシリーズ第三回は、疑似要素と疑似クラス。

といっても、CSS3で追加された疑似クラスがけっこう多いため今回はレベル1と2のみ、すなわち疑似要素&疑似クラスの基本を網羅したいと思います。

合い言葉は「疑似要素と疑似クラスで表現の幅を広げよう!」

記事の続きを読む

【サンプル有】入門からCSS3まで!属性セレクタリファレンス

痒いところに手が届くスタイル指定!

attr-selector

前回は、classセレクタやidセレクタなど、超基本的なセレクタを紹介しました。

この記事では続編として、属性セレクタをサンプルを交えて解説。CSS2レベルの基本から、CSS3で追加されたものまでを網羅しようと思います。

属性セレクタを知っておくと、かゆいところに手が届くようなスタイル指定が可能になりますよ。

記事の続きを読む

【初心者対象】超基礎的なCSSセレクタの種類一覧

“基本も基本…大原則だっ…!”

by 伊藤開司(マンガ:賭博黙示録カイジ)

basic-selector

CSS3では、かなり小技の効いた擬似要素などのセレクタが追加されました。

それらを知ることも大切ですが、まずは基本であるCSS1・CSS2レベルを押さえておくことが肝要。

押さえておかないと、例えばテンプレートのちょっとしたカスタマイズを行うことすらできなってしまうからです。

今日は、超基本的なCSSセレクタを、例を交えて紹介します。

記事の続きを読む

スマホ閲覧時にのみ、telリンクを付与する方法

PCユーザーにtelリンクを見せたくない!

tel-link

スマホサイトを作成する場合、電話番号をタップするだけで発信できるように、通常telリンク(a href=”tel:00-0123-4567″)を設置します。
(※iPhoneの場合、設定しなくてもタップ発信可能。)

ですが、レスポンシブサイトにおいて、普通に電話リンクを設置するのは良ろしくありません。

なぜなら、PCなどでの閲覧者がリンクをクリックした際に「プロトコルが不明です」といったメッセージが出力されてしまうから。

今回は、JavaScriptを使った上記への対処法を紹介します。

記事の続きを読む

人気の無料メール講座を、ご利用ください。

  • 【プロ直伝】制作前に必ず行う2つのこととは?
  • 【重要】収益サイト制作者が取るべき手段は何か?
  • 【発表】魅せるデザインのラインナップはこちらです。
  • 【無料】必ず入れておくべき、フリープラグイン8選!
  • 【一瞬】瞬時にサイトの印象を引き立てる方法。
  • 【3.5倍】こうして成約率が急上昇しました。
  • 【注意】なぜ記事を増やしてもアクセスが伸びないのか?

※下記のフォームからメール講座に ご登録いただけます。

サイトをシェアする

  • Tweetする
  • FaceBookでシェアする
  • はてブにBookmarkする
  • Google+で共有する

flight