[Đóng góp] code trang trí trung thu

  Bài viết hay nhất1
Dự là sắp đến trung thu nên mình share code trang trí trung thu để anh em sửa sang lại 4rum đẹp hơn để đón trung thu

Demo:


Demo onl: http://www.vngame.pro/

B1 :tìm trong head code
Code:
<a id="top" name="top" accesskey="t"></a>

thay thành
Code:

<div id="cover-cloud">
  <div id="cloud"></div>
  <div id="cloud2"></div>
  <div id="cloud3"></div>
</div>
  <div class="logo1"></div>
 <script src="http://shareallworld.googlecode.com/files/Jquery.spritely-0.1.js" type="text/javascript"></script>
 <script type='text/javascript'>
(function($) {
   $(document)
      .ready(function() {
         $('#cloud')
            .pan({
               fps: 30,
               speed: 1,
               dir: 'right'
            });
         $('#cloud2')
            .pan({
               fps: 30,
               speed: 2,
               dir: 'right'
            });
         $('#cloud3')
            .pan({
               fps: 30,
               speed: 0.5,
               dir: 'right'
            });
      });
})(jQuery);
</script>
<a id="top" name="top" accesskey="t"></a>


B2: tìm tiếp
Code:
<div class="pun">

thay thành:
Code:
<div class="pun">
<div class="logo2">
</div>
<div class="logo3">
</div>


B3 : thêm vào css
Code:
#cover-cloud{width:100%;min-width:1074px;height:180px;position:absolute;z-index:100;left:0;top:10px}
#cloud2{background:url(http://i.imgur.com/4kjtdZ2.png) repeat-x 0 0;position:absolute;width:100%;height:105px;z-index:300}
#cloud3{background:url(http://i.imgur.com/mVPxOg4.png) repeat-x 0 0;position:absolute;width:100%;height:26px;z-index:400}
.logo1{float:left;left:0;top:0;  height:480px;  width:400px;  background:url(http://hocwp.net/demo/trungthu/wp-content/themes/sbtheme_trungthu/images/header-left.png);vertical-align:middle;    position:absolute}
.logo2{background:url(http://hocwp.net/demo/trungthu/wp-content/themes/sbtheme_trungthu/images/chi-hang.png);float:right;height:500px;    position:absolute;margin-left:765px;top:87px;width:349px}
.logo3{background:url(http://i.imgur.com/ClXU85Y.png);float:right;height:100px;    position:absolute;margin-left:300px;top:150px;width:500px}
body{background:#f3bb51;background-attachment:scroll;background-image:url(http://hocwp.net/demo/trungthu/wp-content/themes/sbtheme_trungthu/images/header-right.png);background-position:top;background-repeat:no-repeat;color:#333;font-family:'Noto Sans',sans-serif;font-size:13px}

Lưu ý: các bạn xóa css body của skin đi nhé
Chú ý*:
Bạn nào muốn xoá logo vngame ở giữa thì tìm ở bước 2 có đoạn
Code:
<div class="logo3"></div>
xoá nó đi
và tìm tiếp ở bước 3 có đoạn
Code:
.logo3{background:url(http://i.imgur.com/ClXU85Y.png);float:right;height:100px;    position:absolute;margin-left:300px;top:150px;width:500px}
xoá nó luôn
Bạn nào không muốn xoá mà chỉ muốn thay thế thì tìm ở bước 3 có đoạn
Code:
.logo3{background:url(http://i.imgur.com/ClXU85Y.png);float:right;height:100px;    position:absolute;margin-left:300px;top:150px;width:500px}
thay http://i.imgur.com/ClXU85Y.png thành link ảnh logo bạn muốn nhé

đây là mình hướng dẫn chung chung vì kích thước và cấu trúc mỗi skin 1 khác nên các bạn chỉnh sửa css và thay đổi vị trí thẻ div cho phù hợp với skin.
  Bài viết hay nhất2
Mấy cái mây để cho nó trôi từ từ như trong demo thì có thể dùng animation
The author of this message was banned from the forum - See the message
  Bài viết hay nhất4

hoangtin4vn wrote:thật sự thì code giống của 9xstudio.biz nhưng chỉ cần thay mấy cái hình trong css là xong nhé :v
bạn đang nói cái mây trôi à? cái mây trôi chuẩn men là của 9xstudio từ lâu lâu lắm rồi. còn những thứ khác thì tôi ko hề lấy của 9xstudio
The author of this message was banned from the forum - See the message
  Bài viết hay nhất6
Chỗ này 1 ít, chỗ kia 1 tẹo ^_______^
You cannot reply to topics in this forum