Change background image
LOVE quotion

Bắt đầu từ 4.53' thứ Hai ngày 17/10/2011


You are not connected. Please login or register

LOVE quotion » INTERNET » Forumotion » Các kiểu menu ẩn/hiện

Xem chủ đề cũ hơn Xem chủ đề mới hơn Go down  Thông điệp [Trang 1 trong tổng số 1 trang]

KHCN
KHCN Ưu tú

Cấp bậc: Ưu tú

Giới tính : Nam

Bài viết : 798

Danh vọng : 1622

Uy tín : 23

Tường nhà Tường nhà Xem bài viết Bài viết Kết bạn Kết bạn Chặn người này Ngăn cấm
Ảnh demo menu hỗ trợ online:

Các kiểu menu ẩn/hiện Rsuppo10 Các kiểu menu ẩn/hiện Rsuppo11 Các kiểu menu ẩn/hiện Rsuppo12 Các kiểu menu ẩn/hiện Rsuppo13 Các kiểu menu ẩn/hiện Rsuppo14 Các kiểu menu ẩn/hiện Rsuppo15
Chèn vào CSS:

Code:
/* BEGIN support */
#gs {
    position: fixed;
    top: 30px;
    z-index: +1001;
    }
* html#gs {
    position: relative;
    }
.gstab {
    float: left;
    height: 148px;
    width: 25px;
    background: url('http://i37.servimg.com/u/f37/17/47/65/80/rsuppo10.png') no - repeat scroll 0 0 transparent;
    }
.gstab: hover {
    float: left;
    height: 148px;
    width: 50px;
    cursor: pointer;
    background: url('http://i37.servimg.com/u/f37/17/47/65/80/rsuppo11.png') no - repeat
    }
.gscontent {
    float: left;
    border: 2px solid#FFF;
    border-right: none;
    border-radius: 0 0 0 10px;
    background: #F5F5F5;
    padding: 10px;
    font-size: 12px;
    }

Chèn vào overall_footer hoặc index_body, trước thẻ :

Code:
<script type="text/javascript">
    function showHideGS() {
        var gs = document.getElementById("gs");
        var w = gs.offsetWidth;
        gs.opened ? moveGS(0, 50 - w) : moveGS(50 - w, 0);
        gs.opened = !gs.opened;
    }

    function moveGS(x0, xf) {
        var gs = document.getElementById("gs");
        var dx = Math.abs(x0 - xf) > 10 ? 5 : 1;
        var dir = xf > x0 ? 1 : -1;
        var x = x0 + dx * dir;
        gs.style.right = x.toString() + "px";
        if (x0 != xf) {
            setTimeout("moveGS(" + x + ", " + xf + ")", 10);
        }
    }
</script>
<div style="right: -180px;" id="gs">
    <div class="gstab" onclick="showHideGS()">
    </div>
    <div class="gscontent">
    ... nội dung hỗ trợ ...
    </div>
</div>

Phần "... nội dung hỗ trợ ...", các bạn có thể soạn theo mẫu sau và thay thế:

Code:
<table border="0" width="156">
    <tr>
        <td align="center">
            <p>
                <img src="http://dl.dropbox.com/u/24716029/images/techsupport.gif" border="0">
                <br />
                <hr>
                <br />
                <p>
                    <strong>
                        <span style="color:#FF0000">CMC Soft</span>
                        <br />Hoàng Trọng Phúc</strong>
                </p>
                <p>
                    <a href="ymsgr:sendim?trau0963"><img border=0 src="http://opi.yahoo.com/online?u=trau0963&m=g&t=2&l=us"></a>
                </p>
                <p>
                    <img src="http://dl.dropbox.com/u/24716029/images/mobilephone.gif" alt="mobile phone"
                    border="0">
                    <strong>090 421 0749</strong>
                </p>
                <p></p>
                <br />
        </td>
    </tr>
</table>
      
Nuts
Nuts Tích cực

Cấp bậc: Tích cực

Bài viết : 300

Danh vọng : 648

Uy tín : 23

Tường nhà Tường nhà Xem bài viết Bài viết Kết bạn Kết bạn Chặn người này Ngăn cấm
Demo đơn giản: Các kiểu menu ẩn/hiện Hotroonline

Chèn vào CSS:

Code:
/* BEGIN support */
#gs {
    position: fixed;
    top: 50px;
    z-index: +1001;
    }
* html#gs {
    position: relative;
    }
.gstab {
    height: 120px;
    width: 30px;
    float: left;
    cursor: pointer;
    background: url('https://dl.dropbox.com/u/24716029/images/hotroonline.png') no - repeat;
    }
.gscontent {
    float: left;
    border: 2px solid #990000;
    background:# F5F5F5;
    padding: 10px;
    font-size: 12px
    }

Chèn vào overall_footer:

Code:
<script type="text/javascript">
function showHideGS(){
var gs = document.getElementById("gs");
var w = gs.offsetWidth;
gs.opened ? moveGS(0, 30-w) : moveGS(30-w, 0);
gs.opened = !gs.opened;
}
function moveGS(x0, xf){
var gs = document.getElementById("gs");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gs.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGS("+x+", "+xf+")", 10);}
}
</script>
<div style="right: -180px;" id="gs">
 <div class="gstab" onclick="showHideGS()"></div>
 <div class="gscontent">
 
 <table border="0" width="156">
  <tr>
    <td align="center"><p><img src="http://dl.dropbox.com/u/24716029/images/techsupport.gif" border="0"><br />
    <hr><br />
      <p><strong><span style="color:#FF0000">CMC Soft</span><br />
      Hoàng Trọng Phúc</strong></p>
        <p><a href="ymsgr:sendim?trau0963"><img border=0 src="http://opi.yahoo.com/online?u=trau0963&m=g&t=2&l=us"></a></p>
        <p><img src="http://dl.dropbox.com/u/24716029/images/mobilephone.gif" alt="mobile phone" border="0"><strong> 090 421 0749</strong></p>
        <p></p>
        <br />
    </td>
  </tr>
 </table>
 </div>
</div>
      
kẻ đương thời

#3Các kiểu menu ẩn/hiện Empty Khung nhạc ẩn

kẻ đương thời
kẻ đương thời Ưu tú

Cấp bậc: Ưu tú

Giới tính : Nam

Bài viết : 665

Danh vọng : 1151

Uy tín : 42

Tường nhà Tường nhà Xem bài viết Bài viết Kết bạn Kết bạn Chặn người này Ngăn cấm
Demo của khoailang89:

Các kiểu menu ẩn/hiện Musicb10

Chèn vào overall_footer:

Code:
<!-- Menu Nhạc -->
<style type="text/css" >
  #gm {
    position: fixed;
    top: 30px;
    z-index: +1111;
  }
  *html#gm {position: relative;}
  .gmtab {
    height: 35px;
    width: 35px;
    float: left;
    cursor: pointer;
    background: url('http://www.servimg.com/u/f38/17/58/45/30/music10.gif') no-repeat;
  }
  .gmcontent {
    float: left;
    border: 1px solid #000;
    background:#DDD;
    padding: 10px;
  }
</style>
 
<script type="text/javascript">
    function showHideGM() {
        var gm = document.getElementById("gm");
        var w = gm.offsetWidth;
        gm.opened ? moveGM(0, 35-w) : moveGM(35-w, 0);
        gm.opened = !gm.opened;
    }
    function moveGM(x0, xf) {
        var gm = document.getElementById("gm");
        var dx = Math.abs(x0 - xf) > 30 ? 30 : 1;
        var dir = xf > x0 ? 1 : -1;
        var x = x0 + dx * dir;
        gm.style.right = x.toString() + "px";
        if (x0 != xf) {
            setTimeout("moveGM("+x+", "+xf+")", 5);
        }
    }
</script>

<div id="gm" style="right: -423px" >
    <div class="gmtab" onclick="showHideGM()"></div>
    <div class="gmcontent">
        <object width="400" height="250">
            <param name="movie" value="http://static.mp3.zing.vn/skins/mp3_main/flash/embed/zing_mp3_embed_v1.2.swf?xmlURL=http://mp3.zing.vn/xml/album-xml/LGxGtXGzVmLLykDJtFmZG&amp;autostart=false">
            <param name="quality" value="high">
            <param name="wmode" value="transparent">
            <embed width="400" height="250" src="http://static.mp3.zing.vn/skins/mp3_main/flash/embed/zing_mp3_embed_v1.2.swf?xmlURL=http://mp3.zing.vn/xml/album-xml/LGxGtXGzVmLLykDJtFmZG&amp;autostart=false"
            quality="high" wmode="transparent" type="application/x-shockwave-flash">
        </object>
    </div>
</div>         



Đã dùng cho sport (tách riêng CSS) nhưng thiếu code (sẽ hoàn chỉnh sau)

Chèn vào CSS:

Code:
/* BEGIN music */
  #gm{position:fixed;
  top:150px;
  z-index:+1001;}
  * html #gm{position:relative;}
  .gmtab{height:35px;
  width:35px;
  float:left;
  cursor:pointer;
  background:url('http://www.animatedgif.net/musicsound/node1_e0.gif') no-repeat;}
  .gmcontent{float:left;border:2px solid #990000; background: #F5F5F5; padding:10px;}
      
kẻ đương thời

#4Các kiểu menu ẩn/hiện Empty Menu Lý lịch Thành viên

kẻ đương thời
kẻ đương thời Ưu tú

Cấp bậc: Ưu tú

Giới tính : Nam

Bài viết : 665

Danh vọng : 1151

Uy tín : 42

Tường nhà Tường nhà Xem bài viết Bài viết Kết bạn Kết bạn Chặn người này Ngăn cấm
Demo từ chính chvlq2:

Các kiểu menu ẩn/hiện Lylich29
Chèn vào CSS:

Code:
/* BEGIN profile */
  #gp{position:fixed;top:50px;z-index:+1000;}
  * html #gp{position:relative;}
  .gptab{height:150px;width:30px;float:left;cursor:pointer;background:url('http://i99.servimg.com/u/f99/11/79/54/63/1110.png') no-repeat;}
  .gpcontent{float:left;border:2px solid #990000;background:#F5F5F5;padding:10px;font-size:12px}
/* END profile */

Chèn vào overall_footer:

Code:
<!-- BEGIN switch_user_logged_in -->
<script type="text/javascript">
function showHideGP(){
var gp = document.getElementById("gp");
var w = gp.offsetWidth;
gp.opened ? moveGP(0, 30-w) : moveGP(20-w, 0);
gp.opened = !gp.opened;
}
function moveGP(x0, xf){
var gp = document.getElementById("gp");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gp.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGP("+x+", "+xf+")", 10);}
}
</script>
<div style="right: -174px;" id="gp">
<div class="gptab" onclick="showHideGP()">
</div>
<div class="gpcontent">

<table border="0" width="150">
  <tr>
    <td align="left">
      <img src="http://dl.dropbox.com/u/24716029/images/thongtin.png" alt="" border="0"><strong> Lý lịch của bạn</strong>
        <br><br>
        <img src="http://dl.dropbox.com/u/24716029/images/arrow.gif" alt="" border="0"><a href="/profile?mode=editprofile" class="postlink" target="_blank"> Thông tin của bạn</a><br>
        <img src="http://dl.dropbox.com/u/24716029/images/arrow.gif" alt="" border="0"><a href="/profile?mode=editprofile&page_profil=preferences" class="postlink" target="_blank"> Tùy chỉnh giao diện</a><br>
        <img src="http://dl.dropbox.com/u/24716029/images/arrow.gif" alt="" border="0"><a href="/profile?mode=editprofile&page_profil=signature" class="postlink" target="_blank"> Sửa chữ ký</a><br>
        <img src="http://dl.dropbox.com/u/24716029/images/arrow.gif" alt="" border="0"><a href="/profile?mode=editprofile&page_profil=avatars" class="postlink" target="_blank"> Sửa hình đại diện</a><br>
        <img src="http://dl.dropbox.com/u/24716029/images/arrow.gif" alt="" border="0"><a href="/profile?mode=editprofile&page_profil=friendsfoes" class="postlink" target="_blank"> Danh sách bạn/thù</a><br>
        <img src="http://dl.dropbox.com/u/24716029/images/arrow.gif" alt="" border="0"><a href="/privmsg?folder=inbox" class="postlink" target="_blank"> Hộp thư của bạn</a><br><br>
    </td>
  </tr>
  <tr>
    <td align="left"><img src="http://dl.dropbox.com/u/24716029/images/contact.png" border="0"><strong> Liên hệ giao dịch</strong>
      <br><br>
        <img src="http://dl.dropbox.com/u/24716029/images/arrow.gif" alt="" border="0"><a href="/privmsg?mode=post&u=9" class="postlink" target="_blank"> Mod <strong>Thầy giáo Làng</strong></a><br>
        <img src="http://dl.dropbox.com/u/24716029/images/arrow.gif" alt="" border="0"><a href="/privmsg?mode=post&u=2" class="postlink" target="_blank"> Mod <strong>Phó Thường dân</strong></a><br>
        <img src="http://dl.dropbox.com/u/24716029/images/arrow.gif" alt="" border="0"><a href="/privmsg?mode=post&u=51" class="postlink" target="_blank"> Mod <strong>Kẻ đương thời</strong></a><br>
        <br>
    </td>
  </tr>
  <tr>
    <td align="left"><img src="http://dl.dropbox.com/u/24716029/images/sitemap.png" border="0"><strong> Sitemap</strong>
      <br><br>
        <img src="http://dl.dropbox.com/u/24716029/images/arrow.gif" alt="" border="0"><a href="/f1-forum" class="postlink" target="_blank"> Thông báo</a><br>
        <img src="http://dl.dropbox.com/u/24716029/images/arrow.gif" alt="" border="0"><a href="/f12-forum" class="postlink" target="_blank"> Qui định</a><br>
        <img src="http://dl.dropbox.com/u/24716029/images/arrow.gif" alt="" border="0"><a href="/f4-forum" class="postlink" target="_blank"> Đồng đội</a><br><br>
    </td>
  </tr>
</table>
</div>
</div>
<!-- END switch_user_logged_in -->
      
Sponsored content

Cấp bậc:

Tường nhà Tường nhà Xem bài viết Bài viết Kết bạn Kết bạn Chặn người này Ngăn cấm
      

Xem chủ đề cũ hơn Xem chủ đề mới hơn Về Đầu Trang  Thông điệp [Trang 1 trong tổng số 1 trang]

LOVE quotion » INTERNET » Forumotion »Các kiểu menu ẩn/hiện

Quyền hạn của bạn

Bạn không có quyền trả lời bài viết
free counters



  • Đoàn Ngọc Khánh

    mobile phone 098 376 5575


    Đỗ Quang Thảo

    mobile phone 090 301 9666


    Nguyễn Văn Của

    mobile phone 090 372 1401


    IP address signature
    Free forum | ©phpBB | Free forum support | Liên hệ | Báo cáo lạm dụng | Thảo luận mới nhất