Javascript automatsko prebacivanje

Pozdrav,

Može mi tko pomoć napraviti javascript kod za automatsko rotiranje tabova recimo svako 20 sekundi

http://www.stunicholls.com/various/tabbed_pages.html
–> to su tabovi koji se trebaju rotirat!

Puuuuno hvala :slight_smile:

Tu:

tabbed_pages.js

vidis kako se radi na “click”:

if (e.className == 'on' || e.className == 'off') {
		e.onclick = function () {
			var getEls = document.getElementsByTagName('DIV');
				for (var z=0; z<getEls.length; z++) {
				getEls[z].className=getEls[z].className.replace('show', 'hide');
				getEls[z].className=getEls[z].className.replace('on', 'off');
				}
			this.className = 'on';
			var max = this.getAttribute('title');
			document.getElementById(max).className = "show";
			}
		}

Samo promjenis da se to ne zove na “click” nego da se zove svakih 20 sekundi sa “setInterval” funkcijom (
https://developer.mozilla.org/en/window.setInterval
).

Malo se igraj. :smiley:

Hvala na pomoći :). Pokušam svakako nešto uradit

Nemogu nikako stavit da radi tako :smiley:
Stavio sam kod ovaj:

var intervalID;
  
function brojac()
{
  intervalID = setInterval(tabovi2, 1000);
}  

function tabovi() {
	var e, i = 0;
	while (e = document.getElementById('gallery').getElementsByTagName ('DIV') [i++]) {
		if (e.className == 'on' || e.className == 'off') {
		e.onclick = function () {
			var getEls = document.getElementsByTagName('DIV');
				for (var z=0; z<getEls.length; z++) {
				getEls[z].className=getEls[z].className.replace('show', 'hide');
				getEls[z].className=getEls[z].className.replace('on', 'off');
				}
			this.className = 'on';
			var max = this.getAttribute('title');
			document.getElementById(max).className = "show";
			}
		}
	}
}

function tabovi2() {
	var a, b = 0;
	while (a = document.getElementById('gallery').getElementsByTagName ('DIV') [b++]) {

			var getEls = document.getElementsByTagName('DIV');
				for (var c=0; c<getEls.length; c++) {
				getEls[c].className=getEls[c].className.replace('show', 'hide');
				getEls[c].className=getEls[c].className.replace('on', 'off');

			this.className = 'on';
			var max = this.getAttribute('title');
			document.getElementById(max).className = "show";
			}
		}
	}

I u html body stavio onload=“tabovi();brojac();” I neradi :s

Naravno da ti ne radi kad si samo kopirao kod. Treba ga malo prouciti i vidjeti kako funkcionira. Pa malo i nauciti JavaScript. :wink:

Evo moja, malo izmjenjena, verzija:

[HTML]

#gallery {font:11px verdana,arial,sans-serif; width:750px; padding:15px 0 0 0; line-height:15px;} #gallery div.off {color:#000; height:33px; margin-right:2px; line-height:33px; padding:0 20px; float:left; background:url(tabs_0.gif) repeat-x left bottom; border:1px solid #ddd; border-bottom-color:#000; cursor:pointer; position:relative; z-index:20;} #gallery div.on {color:#c00; padding:0 20px; margin-right:2px; margin-top:1px; float:left; background:url(tabs_2.gif) repeat-x left bottom; border:1px solid #000; cursor:pointer; border-bottom:0; height:33px; line-height:32px; position:relative; z-index:100;}
	#tabs div.hide {display:none; width:0; overflow:hidden;}
	#tabs div.show {clear:left; background:#fff; width:708px; margin-top:0; top:-1px; border:1px solid #000;padding:20px; position:relative; z-index:50; font:11px verdana, arial, sans-serif; line-height:18px;}
	#tabs div.show img {float:left; margin:0 10px 10px 0;}
	.clear {clear:both;}
</style>
<script type="text/javascript">
	var tabbedPanes = function() {
		var e, i = 0;
		e = document.getElementById('gallery').getElementsByTagName ('div');
		while (e[i]) {
			if (e[i].className == 'on' || e[i].className == 'off') {
				e[i].onclick = function () {
					var getEls = document.getElementsByTagName('div');
					for (var z=0; z<getEls.length; z++) {
						getEls[z].className=getEls[z].className.replace('show', 'hide');
						getEls[z].className=getEls[z].className.replace('on', 'off');
					}
					this.className = 'on';
					var max = this.title;
					document.getElementById(max).className = "show";
				}
			}
			++i;
		}
	}
	
	var changeTabElement = function(el) {
		var getEls = document.getElementById('gallery').getElementsByTagName('div');
		for (var j=0; j<getEls.length; j++) {
			getEls[j].className=getEls[j].className.replace('on', 'off');
		}
		var getTabs = document.getElementById('tabs').getElementsByTagName('div');
		for (var z=0; z<getTabs.length; z++) {
			getTabs[z].className=getTabs[z].className.replace('show', 'hide');
		}
		el.className = 'on';
		var max = el.title;
		document.getElementById(max).className = "show";
	}
	
	var changeTab = function() {
		var g = document.getElementById('gallery').getElementsByTagName('div');
		for (var i = 0; i < g.length; ++i) {
			if (g[i].className == 'on') {
				changeTabElement(g[(i + 1) % g.length]);
				break;
			}
		}
	}
	
	window.onload = function() { 
		tabbedPanes();
		setInterval('changeTab()', 5000);
	}
</script>

Tabbed Pages

28th November 2007

John Constable
Claude Monet
Vincent Van Gogh
Marc Chagall
Pablo Picasso

Although he showed an early talent for art and began painting his native Suffolk scenery before he left school, his great originality matured slowly.

The Hay Wain

He committed himself to a career as an artist only in 1799, when he joined the Royal Academy Schools and it was not until 1829 that he was grudgingly made a full Academician, elected by a majority of only one vote.

In 1816 he became financially secure on the death of his father and married Maria Bicknell after a seven-year courtship and in the fact of strong opposition from her family. During the 1820s he began to win recognition: The Hay Wain (National Gallery, London, 1821) won a gold medal at the Paris Salon of 1824 and Constable was admired by Delacroix and Bonington among others.

His wife died in 1828, however, and the remaining years of his life were clouded by despondency.


This text is an excerpt from The WebMuseum, Paris

</div>

<div id="Monet" class="hide">
<p>His youth was spent in Le Havre, where he first excelled as a caricaturist but was then converted to landscape painting by his early mentor <a href="http://www.ibiblio.org/wm/paint/auth/boudin/">Boudin</a>, from whom he derived his firm predilection for painting out of doors.</p>
<img src="tabbed_pages/monet.jpg" alt="Women in the Garden" title="Women in the Garden">
<p>In 1859 he studied in Paris at the Atelier Suisse and formed a friendship with <a href="http://www.ibiblio.org/wm/paint/auth/pissarro/">Pissarro</a>. After two years' military service in Algiers, he returned to Le Havre and met <a href="http://www.ibiblio.org/wm/paint/auth/jongkind/">Jongkind</a>, to whom he said he owed `the definitive education of my eye'.</p>
<p>He then, in 1862, entered the studio of Gleyre in Paris and there met Renoir, Sisley, and Bazille, with whom he was to form the nucleus of the Impressionist group.</p> 
<p>Monet's devotion to painting out of doors is illustrated by the famous story concerning one of his most ambitious early works, Women in the Garden (Musée d'Orsay, Paris; 1866-67). The picture is about 2.5 meters high and to enable him to paint all of it outside he had a trench dug in the garden so that the canvas could be raised or lowered by pulleys to the height he required.</p>
<p><a href="http://www.ibiblio.org/wm/paint/auth/courbet/">Courbet</a> visited him when he was working on it and said Monet would not paint even the leaves in the background unless the lighting conditions were exactly right.</p>
<br class="clear">
<p>This text is an excerpt from <a href="http://www.ibiblio.org/wm/paint/auth/monet/">The&nbsp;WebMuseum,&nbsp;Paris</a></p>
</div>

<div id="Vincent" class="hide">
<p>Gogh, Vincent (Willem) van (b. March 30, 1853, Zundert, Neth.--d. July 29, 1890, Auvers-sur-Oise, near Paris), generally considered the greatest Dutch painter and draughtsman after <a href="http://www.ibiblio.org/wm/paint/auth/rembrandt/">Rembrandt</a>.</p>
<img src="tabbed_pages/vincent.jpg" alt="The Starry Night" title="The Starry Night">
<p>With <a href="http://www.ibiblio.org/wm/paint/auth/cezanne/">Cézanne</a> and <a href="http://www.ibiblio.org/wm/paint/auth/gauguin/">Gauguin</a> the greatest of Post-Impressionist artists. He powerfully influenced the current of <a href="http://www.ibiblio.org/wm/paint/glo/expressionism/">Expressionism</a> in modern art. His work, all of it produced during a period of only 10 years, hauntingly conveys through its striking colour, coarse brushwork, and contoured forms the anguish of a mental illness that eventually resulted in suicide. Among his masterpieces are numerous self-portraits and the well-known <a href="http://www.ibiblio.org/wm/paint/auth/gogh/starry-night/">The&nbsp;Starry&nbsp;Night</a> (1889).</p>	
<br class="clear">
<p>This text is an excerpt from <a href="http://www.ibiblio.org/wm/paint/auth/gogh/">The&nbsp;WebMuseum,&nbsp;Paris</a></p>
</div>

<div id="Chagall" class="hide">
<img src="tabbed_pages/chagall.jpg" alt="Adam and Eve" title="Adam and Eve">
<p>Russian-born French painter. Born to a humble Jewish family in the ghetto of a large town in White Russia, Chagall passed a childhood steeped in Hasidic culture.</p>
<p>Very early in life he was encouraged by his mother to follow his vocation and she managed to get him into a St Petersburg art school. Returning to Vitebsk, he became engaged to Bella Rosenfeld (whom he married twelve years later), then, in 1910, set off for Paris, 'the Mecca of art'.</p>
<p>He was a tenant at La Ruche, where he had Modigliani and Soutine for neighbours. His Slav Expressionism was tinged with the influence of <a href="http://www.artchive.com/artchive/D/daumier.html">Daumier</a>, Jean-François Millet, the Nabis and the Fauves.</p>
<br class="clear">
<p>He was also influenced by <a href="http://www.artchive.com/artchive/cubism.html">Cubism</a>. Essentially a colourist, Chagall was interested in the Simultaneist vision of Robert Delaunay and the Luminists of the Section d'Or.</p>
</div>

<div id="Picasso" class="hide">	
<img src="tabbed_pages/picasso.jpg" alt="Girtl in front of mirror" title="Girtl in front of mirror">
<p>Pablo Picasso, born in Spain, was a child prodigy who was recognized as such by his art-teacher father, who ably led him along.</p>
<p>The small Museo de Picasso in Barcelona is devoted primarily to his <a href="http://www.artchive.com/artchive/P/picasso_early.html">early works</a>, which include strikingly realistic renderings of casts of ancient sculpture.</p>
<p>He was a rebel from the start and, as a teenager, began to frequent the Barcelona cafes where intellectuals gathered.</p>
<p>He soon went to Paris, the capital of art, and soaked up the works of Manet, Gustave Courbet, and <a href="http://www.artchive.com/artchive/T/toulouse-lautrec.html">Toulouse-Lautrec</a>, whose sketchy style impressed him greatly. Then it was back to Spain, a return to France, and again back to Spain - all in the years 1899 to 1904.</p>
<br class="clear">
<p>....</p>
</div>
[/HTML]

Nije idealna verzija, trebalo bi malo bolje i optimalnije to napraviti … al radi u vise manje svim meni dostupnim browserima.

Uspio sam uz pomoć jednog kolege napravit. Dosta je manji kod :slight_smile: al sam zaboravio postati!

Inače tebi puuuuno hvala na pomoći!


Copyright © 2020 WM Forum - AboutContact - Sponsored by: Mydataknox & Webmaster.Ninja