[jQuery] Animation：讓背景圖片跟著滑鼠移動
Sample code
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
<title>Create an Interactive Background with jQuery Interactive BG</title>
<style>
.bg {
width : 100%;
height: 500px;
margin: auto;
}
</style>
</head>
<body>
<div class="bg" data-ibg-bg="bg.jpg"></div>
<!-- java script -->
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="js/jquery.interactive_bg.js"></script>
<script>
$(".bg").interactive_bg();
</script>
</body>
</html>
Source
☞ Login to Your Account☞ CSS Background Animations
☞ (範例檔) JQuery Interactive BG
☞ Create an Interactive Moving Background or Object that Reacts to Viewer’s Cursor
☞ Auto-Moving Parallax Background
☞ Animated Background - CSS Background Moves with Cursor
☞ moving background-image on mousemove
沒有留言: