Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 29.07.2014, 02:24
Новичок на форуме
Отправить личное сообщение для mcsignal Посмотреть профиль Найти все сообщения от mcsignal
 
Регистрация: 29.07.2014
Сообщений: 2

Нужно чтобы первый блок был открыт
Всем привет!
Прошу помощи в решении этой задачки


Есть скрипт -
<script type="text/javascript">
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(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);
 }
}
</script>


и сам HTML

<body onload="slider('slider',0)">
<p>
<div id="slider">
<table width="100%" border="0">
  <tr>
    <td align="center" bgcolor="#f7ebd5"><div class="header" id="1-header"><img alt="" src="ceni/0-4est.jpg" /></div></td>
    <td align="center" bgcolor="#f7ebd5"><div class="header" id="2-header"><img alt="" src="ceni/5-8est.jpg" /></div></td>
    <td align="center" bgcolor="#f7ebd5"><div class="header" id="4-header"><img alt="" src="ceni/9-12est.jpg" /></div></td>
  </tr>
</table>

<p>&nbsp;</p>
<table width="100%" border="0">
  <tr>
    <td> 
     <div class="content" id="1-content">
 <div class="text">
 <table width="100%" border="0">
  <tr>
    <td>&nbsp;</td>
    <td align="center" bgcolor="#f7ebd5"><a href="?page_id=361"><img src="EST1.png" width="750" height="120" alt=""/></a></td>
    <td>&nbsp;</td>
  </tr>
</table>

   <table width="100%" border="0">
     <tr>
       <td align="center" bgcolor="#f7ebd5"><a href="?page_id=361"><img alt="" src="ceni/1.jpg" /></a></td>
       <td align="center" bgcolor="#f7ebd5"><a href="?page_id=361"><img alt="" src="ceni/2.jpg" /></a></td>
       <td align="center" bgcolor="#f7ebd5"><a href="?page_id=361"><img alt="" src="ceni/3.jpg" /></a></td>
     </tr>
   </table>
 </div>
 </div>
     <div class="content" id="2-content">
 <div class="text">
  <table width="100%" border="0">
  <tr>
    <td>&nbsp;</td>
    <td align="center" bgcolor="#f7ebd5"><a href="?page_id=361"><img src="EST2.png" width="750" height="120" alt=""/></a></td>
    <td>&nbsp;</td>
  </tr>
</table>
 <table width="100%" border="0">
     <tr>
       <td align="center" bgcolor="#f7ebd5"><a href="?page_id=361"><img alt="" src="ceni/4.jpg" /></a></td>
       <td align="center" bgcolor="#f7ebd5"><a href="?page_id=361"><img alt="" src="ceni/5.jpg" /></a></td>
       <td align="center" bgcolor="#f7ebd5"><a href="?page_id=361"><img alt="" src="ceni/6.jpg" /></a></td>
     </tr>
   </table>
 </div>
 </div>
 <div class="content" id="4-content">
 <div class="text">
  <table width="100%" border="0">
  <tr>
    <td>&nbsp;</td>
    <td align="center" bgcolor="#f7ebd5"><a href="?page_id=361"><img src="EST3.png" width="750" height="120" alt=""/></a></td>
    <td>&nbsp;</td>
  </tr>
</table>
 <table width="100%" border="0">
     <tr>
       <td align="center" bgcolor="#f7ebd5"><a href="?page_id=361"><img alt="" src="ceni/7.jpg" /></a></td>
       <td align="center" bgcolor="#f7ebd5"><a href="?page_id=361"><img alt="" src="ceni/8.jpg" /></a></td>
       <td align="center" bgcolor="#f7ebd5"><a href="?page_id=361"><img alt="" src="ceni/9.jpg" /></a></td>
     </tr>
   </table>
 </div>
 </div></td>
  </tr>
</table>

</div>


нужно чтобы первый блок при загрузки страницы был открыт... что-то не выходит ни как сделать... уже 4 день мучаюсь перепробовал кучу скриптов но ни как не выходит сделать как надо.
Ответить с цитированием
  #2 (permalink)  
Старый 29.07.2014, 04:17
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,070

mcsignal,

<body onload="slider('slider',0);document.getElementById('1-header').onclick()  ">
Ответить с цитированием
  #3 (permalink)  
Старый 29.07.2014, 08:57
Новичок на форуме
Отправить личное сообщение для mcsignal Посмотреть профиль Найти все сообщения от mcsignal
 
Регистрация: 29.07.2014
Сообщений: 2

Ох... спасибо вам большое! Вроде что-то подобное делал а оно не работало

Еще раз спасибо!!!
Ответить с цитированием
  #4 (permalink)  
Старый 21.01.2016, 06:46
Аспирант
Отправить личное сообщение для Lecseus Посмотреть профиль Найти все сообщения от Lecseus
 
Регистрация: 13.08.2015
Сообщений: 45

подскажите пожалуйста по этому же коду как сделать так, чтобы при раскрытии одного блока по этому javascript коду скрывались остальные, не просто сворачивались, а пропадали. но чтобы при сворачивании этого блока они появлялись обратно?
Ответить с цитированием
  #5 (permalink)  
Старый 21.01.2016, 10:01
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,070

Сообщение от Lecseus
а пропадали
строка 74 убрать currheight < 2 &&
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Нужно, чтобы getTime() постоянно показывала текущее время без обновления страницы aldrve Общие вопросы Javascript 6 03.10.2017 19:29
Что нужно дописать в коде чтобы изображение менялось постоянно. vadim90k (X)HTML/CSS 22 09.07.2012 16:33
Нужно чтобы текст из формы попал в reg.exec() lexon Общие вопросы Javascript 4 05.06.2012 07:03
Сколько времени нужно одному типу, чтобы написать движок форума? Alex455 Оффтопик 17 22.05.2011 11:14
Фиксированный блок kakarotto Элементы интерфейса 2 09.07.2010 00:20