31/08/2021

Como criar um álbum de texto

Como criar um álbum de texto

É isso mesmo. Existem os álbuns de fotos. Os álbuns de texto são bem parecidos. Você usa o mesmo espaço com vários textos diferentes.

O código deve ser copiado e colado no seu gadget - html - java. Faça as devidas modificações. Crie textos diferentes. Salve e veja como fica bom.

Fico legal para tópicos sobre o mesmo assunto e como ele é feito em gadget você pode usa-lo para dar início a sua primeira página.

Veja o código abaixo.

Como criar um álbum de texto

-----------------------------------------------------
<style type="text/css">



.gallerycontroller{

width: 430px

}



.gallerycontent{

width: 400px;

height: 200px;

border: 3px double green;

background-color: #fffd56;

padding: 3px;

display: block;

}



</style>



<script type="text/javascript">



var tickspeed=3000 //ticker speed in miliseconds (2000=5 seconds)

var displaymode="auto" //displaymode ("auto" or "manual"). No need to modify as form at the bottom will control it, unless you wish to remove form.



if (document.getElementById){

document.write('<style type="text/css">\n')

document.write('.gallerycontent{display:none;}\n')

document.write('</style>\n')

}



var selectedDiv=0

var totalDivs=0



function getElementbyClass(classname){

partscollect=new Array()

var inc=0

var alltags=document.all? document.all.tags("DIV") : document.getElementsByTagName("*")

for (i=0; i<alltags.length; i++){

if (alltags[i].className==classname)

partscollect[inc++]=alltags[i]

}

}



function contractall(){

var inc=0

while (partscollect[inc]){

partscollect[inc].style.display="none"

inc++

}

}



function expandone(){

var selectedDivObj=partscollect[selectedDiv]

contractall()

selectedDivObj.style.display="block"

temp.options[selectedDiv].selected=true

selectedDiv=(selectedDiv<totalDivs-1)? selectedDiv+1 : 0

if (displaymode=="auto")

autocontrolvar=setTimeout("expandone()",tickspeed)

}



function populatemenu(){

temp=document.gallerycontrol.menu

for (m=temp.options.length-1;m>0;m--)

temp.options[m]=null

for (i=0;i<totalDivs;i++){

var thesubject=partscollect[i].getAttribute("subject")

thesubject=(thesubject=="" || thesubject==null)? "HTML Content "+(i+1) : thesubject

temp.options[i]=new Option(thesubject,"")

}

temp.options[0].selected=true

}



function manualcontrol(menuobj){

if (displaymode=="manual"){

selectedDiv=menuobj

expandone()

}

}



function preparemode(themode){

displaymode=themode

if (typeof autocontrolvar!="undefined")

clearTimeout(autocontrolvar)

if (themode=="auto"){

document.gallerycontrol.menu.disabled=true

autocontrolvar=setTimeout("expandone()",tickspeed)

}

else

document.gallerycontrol.menu.disabled=false

}





function startgallery(){

document.getElementById("controldiv").style.display="block"

getElementbyClass("gallerycontent")

totalDivs=partscollect.length

populatemenu()

for (i=0; i<document.gallerycontrol.mode.length; i++){

if (document.gallerycontrol.mode[i].checked)

displaymode=document.gallerycontrol.mode[i].value

}

if (displaymode=="auto")

document.gallerycontrol.menu.disabled=true

expandone()

}



if (window.addEventListener)

window.addEventListener("load", startgallery, false)

else if (window.attachEvent)

window.attachEvent("onload", startgallery)

else if (document.getElementById)

window.onload=startgallery



</script>



<div class="gallerycontent" subject="TEXTO 01">

ESCREVER AQUI 1

</div>



<div class="gallerycontent" subject="TEXTO 02">

ESCREVER AQUI 2

</div>



<div class="gallerycontent" subject="TEXTO 03">

ESCREVER AQUI 3

</div>



<div id="controldiv" style="display:none" class="gallerycontroller">

<form name="gallerycontrol">

<select class="gallerycontroller" size="3" name="menu" onchange="manualcontrol(this.options.selectedIndex)">

<option />Blank form

</select><br />

Auto: <input type="radio" checked name="mode" value="auto" onclick="preparemode('auto')" /> Manual: <input type="radio" name="mode" value="manual" onclick="preparemode('manual')" />

</form>

</div>
-----------------------------------------------------


Você pode ainda aumentar o número de páginas mas isso deixaria sua página mais pesada.
Substitua o que está em vermelho pelos seus textos.
O código é um pouco grande mas vale a pena, caso você precise.

Não deixe de comentar e até a próxima...

Nenhum comentário:

Postar um comentário

Faça comentários somente sobre o assunto do Post.
Não use palavras impróprias.

Veja também