![](https://htmlforum.dev/uploads/set_resources_18/84c1e40ea0e759e3f1505eb1788ddf3c_pattern.png)
web_finans
-
Posts
12 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Posts posted by web_finans
-
-
работает
var array = new Array();
var speed = 10;
var timer = 10;
// Loop through all the divs in the slider parent div //
// Calculate seach content divs height and set it to a variable //
function slider(target,showfirst) {
var slider = document.getElementById(target);
var divs = slider.getElementsByTagName('div');
var divslength = divs.length;
for(i = 0; i < divslength; i++) {
var div = divs[i];
var divid = div.id;
if(divid.indexOf("header") != -1) {
div.onclick = new Function("processClick(this)");
} else if(divid.indexOf("content") != -1) {
var section = divid.replace('content-','');
array.push(section);
div.maxh = div.offsetHeight;
if(showfirst == 1 && i == 1) {
div.style.display = 'block';
} else {
div.style.display = 'none';
}
}
}
}
// Process the click - expand the selected content and collapse the others //
function processClick(div) {
var catlength = array.length;
for(i = 0; i < catlength; i++) {
var section = array[i];
var head = document.getElementById('header-' + section);
var cont = 'content-' + section;
var contdiv = document.getElementById(cont);
clearInterval(contdiv.timer);
if(head == div && contdiv.style.display == 'none') {
contdiv.style.height = '0px';
contdiv.style.display = 'block';
initSlide(cont,1);
} else if(contdiv.style.display == 'block') {
initSlide(cont,-1);
}
}
}
// Setup the variables and call the slide function //
function initSlide(id,dir) {
var cont = document.getElementById(id);
var maxh = cont.maxh;
cont.direction = dir;
cont.timer = setInterval("slide('" + id + "')", timer);
}
// Collapse or expand the div by incrementally changing the divs height and opacity //
function slide(id) {
var cont = document.getElementById(id);
var maxh = cont.maxh;
var currheight = cont.offsetHeight;
var dist;
if(cont.direction == 1) {
dist = (Math.round((maxh - currheight) / speed));
} else {
dist = (Math.round(currheight / speed));
}
if(dist <= 1) {
dist = 1;
}
cont.style.height = currheight + (dist * cont.direction) + 'px';
cont.style.opacity = currheight / cont.maxh;
cont.style.filter = 'alpha(opacity=' + (currheight * 100 / cont.maxh) + ')';
if(currheight < 2 && cont.direction != 1) {
cont.style.display = 'none';
clearInterval(cont.timer);
} else if(currheight > (maxh - 2) && cont.direction == 1) {
clearInterval(cont.timer);
}
}Спасибо огромное. Нашел ошибки.
-
дайте полностью скрипт и страницу, помогу решить.
Html страница
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="myscript.js"></script>
<link rel="stylesheet" type="text/css" href="mystyle.css" />
</head>
<body onload="slider('slider',0)">
<div id="slider">
<div class="header" id="header-1">А</div><div class="content" id="content-1"><div class="text">...</div></div>
<div class="header" id="header-2">Б</div><div class="content" id="content-2"><div class="text">...</div></div>
<div class="header" id="header-3">В</div><div class="content" id="content-3"><div class="text">...</div></div>
</div>
</body>
</html>
Скрипт js
var array = new Array();
var speed = 10;
var timer = 10;
// Loop through all the divs in the slider parent div //
// Calculate seach content divs height and set it to a variable //
function slider(target,showfirst) {
var slider = document.getElementById(target);
var divs = slider.getElementsByTagName('div');
var divslength = divs.length;
for(i = 0; i < divslength; i++) {
var div = divs;
var divid = div.id;
if(divid.indexOf("header") != -1) {
div.onclick = new Function("processClick(this)");
} else if(divid.indexOf("content") != -1) {
var section = divid.replace('-content','');
array.push(section);
div.maxh = div.offsetHeight;
if(showfirst == 1 && i == 1) {
div.style.display = 'block';
} else {
div.style.display = 'none';
}
}
}
}
// Process the click - expand the selected content and collapse the others //
function processClick(div) {
var catlength = array.length;
for(i = 0; i < catlength; i++) {
var section = array;
var head = document.getElementById(section + '-header');
var cont = section + '-content';
var contdiv = document.getElementById(cont);
clearInterval(contdiv.timer);
if(head == div && contdiv.style.display == 'none') {
contdiv.style.height = '0px';
contdiv.style.display = 'block';
initSlide(cont,1);
} else if(contdiv.style.display == 'block') {
initSlide(cont,-1);
}
}
}
// Setup the variables and call the slide function //
function initSlide(id,dir) {
var cont = document.getElementById(id);
var maxh = cont.maxh;
cont.direction = dir;
cont.timer = setInterval("slide('" + id + "')", timer);
}
// Collapse or expand the div by incrementally changing the divs height and opacity //
function slide(id) {
var cont = document.getElementById(id);
var maxh = cont.maxh;
var currheight = cont.offsetHeight;
var dist;
if(cont.direction == 1) {
dist = (Math.round((maxh - currheight) / speed));
} else {
dist = (Math.round(currheight / speed));
}
if(dist <= 1) {
dist = 1;
}
cont.style.height = currheight + (dist * cont.direction) + 'px';
cont.style.opacity = currheight / cont.maxh;
cont.style.filter = 'alpha(opacity=' + (currheight * 100 / cont.maxh) + ')';
if(currheight < 2 && cont.direction != 1) {
cont.style.display = 'none';
clearInterval(cont.timer);
} else if(currheight > (maxh - 2) && cont.direction == 1) {
clearInterval(cont.timer);
}
}
Стили CSS
#slider {
width: 116px;
color: #fff;
font-family: Georgia;
font-size: 14px;
}
.header {
width: 110px;
height: 20px;
border: 2px solid #3F3F3F;
padding: 1px;
font-weight: bold;
margin-top: 2px;
cursor: pointer;
background: url(knopka2.jpg);
text-align: center;
}
.header:hover {
background: url(knopka3.jpg);
color: #B7B7B7;
}
.content {
overflow: hidden;
}
.text {
width: 200px;
border: 2px solid #3F3F3F;
border-top: none;
padding: 15px;
text-align: left;
background: #7F7F7F;
}
-
Ну вроде если поменять
var section = divid.replace('-content',''); на var section = divid.replace('content-','');
var cont = section + '-content'; на var cont = section + 'content-';
var head = document.getElementById(section + '-header'); на var head = document.getElementById(section + 'header-');
должно работать
да.. Пробовал с самого начала решения проблемы.
-
Копался тут var section = divid.replace('-content','');
и тут var head = document.getElementById(section + '-header');
попробуйте заменить на 'content-' и 'header-'
вот-вот.. менял уже..
-
скорей всего потому что идентификаторы используются js, вы их изменили, вот теперь блоки и не открываются. если я вас правильно понял.
У меня тоже такая мысль (изначально была).
Попытался поиграть с файлом js, но безрезультатно, в силу того , что писал его не я (помогли).
Подскажите, в какую область лезть пожалуйста.
var array = new Array();
var speed = 10;
var timer = 10;
// Loop through all the divs in the slider parent div //
// Calculate seach content divs height and set it to a variable //
function slider(target,showfirst) {
var slider = document.getElementById(target);
var divs = slider.getElementsByTagName('div');
var divslength = divs.length;
for(i = 0; i < divslength; i++) {
var div = divs;
var divid = div.id;
if(divid.indexOf("header") != -1) {
div.onclick = new Function("processClick(this)");
} else if(divid.indexOf("content") != -1) {
var section = divid.replace('-content','');
array.push(section);
div.maxh = div.offsetHeight;
if(showfirst == 1 && i == 1) {
div.style.display = 'block';
} else {
div.style.display = 'none';
}
}
}
}
// Process the click - expand the selected content and collapse the others //
function processClick(div) {
var catlength = array.length;
for(i = 0; i < catlength; i++) {
var section = array;
var head = document.getElementById(section + '-header');
var cont = section + '-content';
var contdiv = document.getElementById(cont);
clearInterval(contdiv.timer);
if(head == div && contdiv.style.display == 'none') {
contdiv.style.height = '0px';
contdiv.style.display = 'block';
initSlide(cont,1);
} else if(contdiv.style.display == 'block') {
initSlide(cont,-1);
}
}
}
// Setup the variables and call the slide function //
function initSlide(id,dir) {
var cont = document.getElementById(id);
var maxh = cont.maxh;
cont.direction = dir;
cont.timer = setInterval("slide('" + id + "')", timer);
}
// Collapse or expand the div by incrementally changing the divs height and opacity //
function slide(id) {
var cont = document.getElementById(id);
var maxh = cont.maxh;
var currheight = cont.offsetHeight;
var dist;
if(cont.direction == 1) {
dist = (Math.round((maxh - currheight) / speed));
} else {
dist = (Math.round(currheight / speed));
}
if(dist <= 1) {
dist = 1;
}
cont.style.height = currheight + (dist * cont.direction) + 'px';
cont.style.opacity = currheight / cont.maxh;
cont.style.filter = 'alpha(opacity=' + (currheight * 100 / cont.maxh) + ')';
if(currheight < 2 && cont.direction != 1) {
cont.style.display = 'none';
clearInterval(cont.timer);
} else if(currheight > (maxh - 2) && cont.direction == 1) {
clearInterval(cont.timer);
}
}
Копался тут var section = divid.replace('-content','');
и тут var head = document.getElementById(section + '-header');
-
Да, можно спокойно в конце добавлять, но не в начале. Имя идентификатора должно начинаться только с буквы.
Благодарю за отзывчивость.
Спасибо.
И все же проблема осталась, а точнее появилась другая:
Таким код был до изменений, но валидацию не проходил:
<div class="header" id="1-header">А</div><div class="content" id="1-content"><div class="text">...</div></div>
<div class="header" id="2-header">Б</div><div class="content" id="2-content"><div class="text">...</div></div>
<div class="header" id="3-header">В</div><div class="content" id="3-content"><div class="text">...</div></div>
Такой код сейчас, но блоки теперь не открываются:
<div class="header" id="header-1">А</div><div class="content" id="content-1"><div class="text">...</div></div>
<div class="header" id="header-2">Б</div><div class="content" id="content-2"><div class="text">...</div></div>
<div class="header" id="header-3">В</div><div class="content" id="content-3"><div class="text">...</div></div>
Код CSS:
#slider {
width: 116px;
color: #fff;
font-family: Georgia;
font-size: 14px;
}
.header {
width: 110px;
height: 20px;
border: 2px solid #3F3F3F;
padding: 1px;
font-weight: bold;
margin-top: 2px;
cursor: pointer;
background: url(knopka2.jpg);
text-align: center;
}
.header:hover {
background: url(knopka3.jpg);
color: #B7B7B7;
}
.content {
overflow: hidden;
}
-
Это я понимаю, но у меня их много, и все идут с одного стиля. Соответственно чтобы не было конфликта, я приписал значения в цифрах. Это можно как то обойти? Или может ставить цифры в конце идентификатора?
-
Всем доброго времени суток.
Не получается разобраться в проблеме с атрибутом "id"
Line 41, Column 72: value of attribute "id" invalid: "1" cannot start a name
…ader">А</div><div class="content" id="1-content"><div class="text">Писатели на…
It is possible that you violated the naming convention for this attribute. For example, id and name attributes must begin with a letter, not a digit.
-
Насчет flash можно попробовать использовать скрипт swfobject подробнее можно посмотреть тут
Решил пока не заморачиваться, убрал весь флеш с сайта.
Благодарю за отзывчивость. Спасибо.
-
Всем доброго времени суток, страничка www.all-read.ru (это не реклама, тем более рекламировать нечего еще). Поставил в конце (в низу) странички ссылку на прохождение валидации.. Выходит премерно 6 ошибок. Я не понимаю этих ошибок. Помогите разобраться пожалуйста.
Одна из ошибок у Вас на закрыт div с классом block1
Остальные ошибки из за вставки flash
За div спасибо, нашел... А вот с флешами проблематично, решения вроде нахожу, но с английским тяжко.
-
Всем доброго времени суток, страничка www.all-read.ru (это не реклама, тем более рекламировать нечего еще). Поставил в конце (в низу) странички ссылку на прохождение валидации.. Выходит премерно 6 ошибок. Я не понимаю этих ошибок. Помогите разобраться пожалуйста.
тег id
in HTML Coding
Posted
Всем доброго времени суток.
У меня такая делема. Как можно обойтись без id, а точнее как прописать в страничке html то, что прописано в отдельном файле css.
Сам отдельный файл css
С обычным style я проблем не имею, а вот что связано например с именами id=menu, я не понимаю. Как весь этот стиль прописать в основной страничке? и обязательно в тегах <body>...</body>.