程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> 更多編程語言 >> 編程綜合問答 >> php-http://www.cheersmug.com/網站上文字的特效是怎樣制作的?

php-http://www.cheersmug.com/網站上文字的特效是怎樣制作的?

編輯:編程綜合問答
http://www.cheersmug.com/網站上文字的特效是怎樣制作的?

http://www.cheersmug.com/網站上 OUR MUGSCUSTOMIZE MUGSABOUT US 文字的特效是怎樣制作的?還有,最好這個也可以在 php 界面中實現效果。我學的不深,請教教我。

最佳回答:


使用jquery做的動畫,綁定mouseenter和mouseout事件即可,你再調整一下樣式就能得到那個效果了

<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script> 
$(document).ready(function(){
  $("#area").bind("mouseenter",function(){
    var div=$("div");
    div.animate({height:'200px',width:'200px'},"fast");
  });
$("#area").bind("mouseout",function(){
    var div=$("div");
    div.animate({height:'180px',width:'180px'},"fast");
 });
});
</script> 
</head>

<body>
<div id="area" style="background:#98bf21;height:180px;width:180px;position:absolute;text-align:center;vertical-align:middle-center">
 <a  href="/product_category.html" style="width:180px;height:180px;text-align:center">OUR MUGS</a>
</div>
</body>
</html>
  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved