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