カテゴリー:
CSS
タグ:
 css data

このエントリーをはてなブックマークに追加
更新日時:
2015年12月29日(火)
作成日時:
2015年12月29日(火)

前の記事 / 次の記事

cssで定義してるんだからcssでアクセスできて当然なんだけど、
普段JavaScriptからアクセスしまくってると忘却してるのでメモ。

参考

HTML5 カスタムデータ属性「data-*」にJavaScript、jQueryからアクセスする方法

HTMLの定義

-# haml
.popup{ data: { popup: "Hello" } }
  触れたらポップアップ

CSSでアクセス

// sass
.popup[data-value]:hover:before
  content: after(data-value)

jQueryでアクセス

# coffee
$(document).on "mouseenter", ".popup", ->
  alert $(".popup").data("value")