Phiên bản đầy đủ: jsB@nk » Framework » jQuery » Khung nội dung kéo thả ở đầu trang
URL: https://www.javascriptbank.com/drop-down-navigation-panel-on-top.html
Đoạn mã này giúp bạn tiết kiệm không gian cho web thông qua một hiệu ứng khá độc đáo: tạo một khung nội dung xổ dọc có thể ẩn/hiện ở phía trên cùng của trang web. Người sử dụng nhấn vào nút nhô ra để kéo khung nội dung xuống, và nhấn thêm một lần nữa tại một vị trí bất kì trong khung để đóng nó lại. Hiệu ứng rất dễ chỉnh sửa và sử dụng, chẳng hạn như chiều cao của khung, nhãn của nút hiển thị, thời gian xuất hiện,...
Phiên bản đầy đủ: jsB@nk » Framework » jQuery » Khung nội dung kéo thả ở đầu trang
URL: https://www.javascriptbank.com/drop-down-navigation-panel-on-top.html
<style type="text/css">#dropdownpanel{ /*Outermost Panel DIV*/position: absolute;width: 100%;left: 0;top: 0;visibility:hidden;}#dropdownpanel .contentdiv{ /*Div containing Ajax content*/background: black;color: white;padding: 10px;}#dropdownpanel .control{ /*Div containing panel button*/border-top: 5px solid black;color: white;font-weight: bold;text-align: center;background: transparent url("panel.gif") center center no-repeat; /*change panel.gif to your own if desired*/padding-bottom: 3px; /* 21px + 3px should equal height of "panel.gif" */height: 21px; /* 21px + 3 px should equal height of "panel.gif" */line-height: 21px; /* 21px + 3px should equal height of "panel.gif" */}</style>
<script type="text/javascript" src="/javascript/jquery.js"></script><script type="text/javascript" src="jkpanel.js">/************************************************ Drop Down Panel script- by JavaScript Kit (www.javascriptkit.com)* This notice must stay intact for usage* Visit JavaScript Kit at http://www.javascriptkit.com/ for this script and 100s more***********************************************/</script>
/javascript/framework/jquery.js/javascript/framework/Drop_Down_Navigation_Panel_on_Top/jkpanel.js/javascript/framework/Drop_Down_Navigation_Panel_on_Top/jsbank_panelcontent.htm/javascript/framework/Drop_Down_Navigation_Panel_on_Top/panel.gif