В этой статье описывается метод реализации JS, чтобы всегда отображать панель инструментов в нижней части веб -страницы с помощью кнопки закрытия. Поделитесь этим для вашей ссылки. Детали следующие:
Это очень практичный код. Он добавляет панель инструментов, которая всегда отображается в нижней части окна браузера. Вы можете поместить объявления, контакты и другую информацию. Панель инструментов этого кода также имеет кнопку закрытия, которая может быть закрыта в любое время.
Скопируйте код следующим образом: <! Doctype html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns = "http://www.w3.org/1999/xhtml">
<голова>
<title> Меню с фиксированным нижним (верхним) </title>
<script type = "text/javascript" src = "js/jquery1.3.2.js"> </script>
<style>
Body, H1, H2, H3, H4, H5, H6, P, UL, LI, DL, DT, DD {Padding: 0; Margin: 0;}
li {list-style: none;} img {border: none;} em {font-style: normal;}
a {color:#555; текстовое-декорация: нет; схема: нет; blr: this.onfocus = this.blur ();}
A: Hover {Color:#000; текстовое декорация: подчеркивается;}
Body {font-size: 12px; font-family: Arial, Verdana, Helvetica, Sans-Serif; Word-Break: Break-All; Word-wrap: разрывы-словес;}
.bnav {text-align: left; высота: 25px; переполнен: скрыт; Маржа: 0 1%; граница:#b4b4b4 1px твердое вещество; Бортовая боттер: нет; z-index: 999; позиция: исправлена; внизу: 0; слева: 0; _position: Absolute;/ * для IE6 */ overflow: visible;}
.close {положение: абсолютное; справа: 5px; высота: 25px; ширина: 16px; текст-интент: -9999px; прокладки-лето: 10px;}
.close a {founally: url (../ Images/201008/close.gif) Центр без повторного оборудования; Ширина: 16px; дисплей: block;}
.bnav2 {высота: 24px; линия линии: 24px; Полевая: 1px; Margin-Bottom: 0; фон:#E5E5E5; }
.bnav .s1 {position: Absolute; слева: 10px;}
.bnav .S1 Img {Padding-top: 3px; маржи-правый: 7px;}
.bnav .s2 {position: Absolute; справа: 30px; Цвет:#888;}
.bnav .s2 span {adding-ruight: 10px;}
.bnav .s2 a {margin: 0 6px;}
.RollText {позиция: абсолют; слева: 160px; высота: 25px; линейная-высота: 25px; переполнение: скрыто;}
.RollText dt, .RollText dd {float: left; ширина: Auto;}
.RollText a {Display: Block; Height: 25px; переполнение: скрыто;}
.bnav3 {высота: 25px; ширина: 16px; линий-высота: 25px; Маржа: 0 1%; Право накладки: 6px; пограничный пакет: нет; z-index: 999; позиция: фиксировано; внизу: 0; справа: 0; _position: Absolute;/ * для ie6 */_ top: выражение (documentElement.scrolltop + documentelement.clientheight-this.offsetheteight); / * для IE6 */ Overflow: Visible;}
.bnav3 a {founal: url (../ Images/201008/open.gif) Центр без повторного оборудования; дисплей: блок; высота: 25px; ширина: 16px; текстовый: -5000px;}
</style>
</head>
<тело>
<script type = "text/javascript">
var closebn = $ .cookie ("bnav");
if (closebn == "0") {stuceNav ();}
Функция sendav () {
$ (". OpenClose"). Toggle ();
$ .cookie ("bnav", "1", {истекает: 1});
}
Функция closenav () {
$ (". OpenClose"). Toggle ();
$ .cookie ("bnav", "0", {истекает: 1});
}
// одиночная прокрутка
function singlescroll () {
$ (". Rolltext dd"). Animate ({margintop: "-25px"}, 500, function () {
$ (this) .css ({margintop: "0px"}). Найти ("a: first"). appendto (this);
});
}
$ (document) .ready (function () {
SetInterval ("SingleScroll ()", 3000);
});
</script>
<div>
<div>
<span>
<a href = "#"> <img src = "Images/201008/qqonline.gif"> </a> <a href = "#"> <img src = "Images/201008/qqonline2.gif"> </a>
</span>
<dl>
<dt> Специальное утверждение: </dt>
<dd>
<a href = "#"> Во время двойного фестиваля в торговом центре есть преданные люди. Пожалуйста, не стесняйтесь делать покупки </a>
<a href = "#"> Мобильные телефоны, продаваемые Tianyue, являются лицензированными товарами из материкового Китая и национальных совместных гарантийных продуктов </a>
<a href = "#"> Мы особо отметили небольшое количество гонконгских и европейских рыночных машин </a>
<a href = "#"> Боги, пожалуйста, больше не задавайте подобных вопросов, номер телефона обслуживания клиентов собирается взорваться </a>
</dd>
</dl>
<span>
<pan> <a href = "#"> [login] </a> <a href = "#"> [зарегистрироваться бесплатно] </a> </span> <a href = "#"> Cart Cart </a> | <a href = "#"> Справочный центр </a> | <a href = "#"
</span>
<pran> <a href = "javaScript: void (0)" onclick = "closeNav ()"> Close </a> </span>
</div>
</div>
<div style = "display: none;"> <a href = "javascript: void (0)" onclick = "shindav ()"> open </a> </div>
</body>
</html>
Я надеюсь, что эта статья будет полезна для каждого программирования JavaScript.