webかたつむり ウェブデザインを勉強中 ウェブ初心者のおぼえがき
読者です 読者をやめる 読者になる 読者になる

webかたつむり

ウェブデザインを勉強中

jQuery "modal window" その2

Create link elements whose href attributes will contain the path of the element you wish to open within the fancyBox.

<a class="fancybox" rel="group" href="big_image_1.jpg"><img src="small_image_1.jpg" alt="" /></a>

<a class="fancybox" rel="group" href="big_image_2.jpg"><img src="small_image_2.jpg" alt="" /></a>

  • 「rel」だと、エラーが出るので、「data」属性で好きな名前を付ける。
  • 「data-group」data-fancybox-group」というグループを作る。
  • 「data attribute」はhtmlにとって、まったく意味はない。けれども、javascriptjqueryを使うときに、仕分けができて便利、といったところか?
  • 「data-」(データハイフン)の後に1文字以上あれば大丈夫らしい。
  • おそらく、このプラグインの仕様で「data-fancy-group」でないときちんと動作しない。

f:id:ohta-felica:20160602223239j:plain