demadema 0 Posted February 19, 2016 Report Share Posted February 19, 2016 Есть JS скрипт спойлеров. 3 ссылки при их нажатии появляется текст под ними. Как сделать чтобы при заходе на страницу был уже открыт 1 блок. <style> #slider { color: #66666; } .header { height: 50px; font-size: 19px; color: white; cursor:pointer; -moz-transition: all 0.5s; -o-transition: all 0.5s; -webkit-transition: all 0.5s; font-weight: bold; color: white; font-weight: normal; cursor:pointer; text-transform: uppercase; float: left; width: 33%; text-align: center; } .header:hover { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -o-transform: scale(1.1); } .content { overflow: hidden; float: left; } .text { } </style> <script type="text/javascript"> var array = new Array(); var speed = 10; var timer = 10; 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'; } } } } 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); } } } function initSlide(id,dir) { var cont = document.getElementById(id); var maxh = cont.maxh; cont.direction = dir; cont.timer = setInterval("slide('" + id + "')", timer); } 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> <body onload="slider('slider',0)"> <div id="intro"> <p> <div id="slider"> <p style="text-align:center">Выберите интересующую Вас экскурсию</p> <div class="header" id="1-header">1Спойлер</div> <div class="header" id="2-header">2Спойлер</div> <div class="header" id="3-header">3Спойлер</div> <div class="content" id="1-content"> <div class="text"> БЛОК1 </div> <div class="content" id="2-content"> <div class="text"> БЛОК2 </div> <div class="content" id="3-content"> <div class="text"> БЛОК3 </div> </div> </div> </div> </p> </div> Link to post Share on other sites
shift196 67 Posted February 19, 2016 Report Share Posted February 19, 2016 toster.ru Link to post Share on other sites
Recommended Posts
Please sign in to comment
You will be able to leave a comment after signing in
Sign In Now