More Related Content
More from Hiroaki Wakamatsu
More from Hiroaki Wakamatsu (6)
Modernizerを用いたHTML5Webサイトの構築
- 20. <!DOCTYPE html>
<html lang="ja">
! <head>
! ! <meta charset="UTF-8" />
! ! <script src="prettyprint.js"></script>
! ! <script src="modernizr.js"></script>
! </head>
! <body>
! ! <div id="debug"></div>
! ! <script>
! ! ! var info = prettyPrint(Modernizr);
! ! ! document.getElementById("debug").appendChild(info);
! ! </script>
! </body>
</html>
- 21. .button {
!
! background-image: url("images/button.png");
}
.cssgradients .button {
! background-image: -webkit-gradient(linear,
! ! center top,
! ! center bottom,
! ! from(#555),
! ! to(#333));
! background-image: -moz-linear-gradient(top, #555, #333);
! background-image: linear-gradient(top, #555, #333);
}
- 22. .button {
!
! background-image: -webkit-gradient(linear,
! ! center top,
! ! center bottom,
! ! from(#555),
! ! to(#333));
! background-image: -moz-linear-gradient(top, #555, #333);
! background-image: linear-gradient(top, #555, #333);
}
.no-cssgradients .button {
! background-image: url("images/button.png");
}
- 24. var evt = {};
if (Modernizr.touch) {
! evt.down = "touchstart";
! evt.move = "touchmove";
! evt.up = "touchend";
} else {
! evt.down = "mousedown";
! evt.move = "mousemove";
! evt.up = "mouseup";
}
document.getElementById("hogehoge").addEventListener(evt.up, function(e) {
! alert(" ");
}, false);
- 25. var src = null;
if (Modernizr.audio.ogg) {
! src = "sample.ogg";
} else if (Modernizr.audio.mp3) {
! src = "sample.mp3";
} else if (Modernizr.audio.m4a) {
! src = "sample.m4a";
}
if (src) {
! var audio = new Audio();
! audio.src = src;
! audio.play();
} else {
! //
}
- 26. var eventEndName = {
! "WebkitTransition": "webkitTransitionEnd",
! "MozTransition": "transitionend",
! "transition": "transitionEnd"
};
document.getElementById("hogehoge").addEventListener(
eventEndName[Modernizr.prefixed("transition")], function(e) {
! // transition
}, false);
