slide non funzionante

**Serex** · 07-08-2012, 12:15

ho messo una slide in modo che cambi ogni volta....ma nella pagine ce nesono altre 3, come mai le altre non funzionano ma funziona solo la prima...
incollo il codice grazie

codice:

<section id="content">
    <div class="content-line"></div>
        <div class="main">
            <div class="container_12">                
                <div class="wrapper p11">
                    <article class="grid_12">
                        <div class="page3-box1">
                            <h3 class="p2">Luxury Rooms</h3>
                            <div class="tabs-box">
                            <ul class="tabs">[*]Rosa[*]verde[*]giallo[*]blu[/list]
                            <div class="clear"></div>
                              <div class="tab_container">
                              <div id="tab1" class="tab_content">
                                <div class="tab-bg"> 
                                    <figure class="page3-img1"><div id="slideshow">
	[img]slide/rosa/terra.jpg[/img]
	[img]slide/rosa/fuoco.jpg[/img]
	[img]slide/rosa/aria.jpg[/img]
	[img]slide/rosa/acqua.jpg[/img]
</div></figure>
                                    <div class="extra-wrap" style="margin-top: 0px; border-top-width: 0px; padding-top: 54px;">
                                        <span>Rosa In Velit Vel Ipsum Auctor Pulvinar</span>
                                        <p class="indent-bot">Congue fermentum auris accums an nulla vel diam. Sed in lacus ut enim adipiscing aliquet. Nulla venena tis. In pede mi, aliquet sit amet, euismod in, auctor ut, ligula. Aliquam dapibus tincidunt metus. Praesent justo dolor, lobortis quis, lobortis dignissim.</p>
    <p class="p10">Vestibulum sed ante. Donec sagittis euismod purus. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo.</p>
                                        <ul class="list1">[*]40-45m²[*]Balcony or terrace[*]Large bathroom with bathtub or shower[*]Separate WC[*]Room safe[*]One bedroom[*]Large living area[*]32" flatscreen TV, telephone, Wi-Fi[/list]
                                    </div>     
                                </div>
                              </div> 
                              <div id="tab2" class="tab_content">
                                <div class="tab-bg"> 
                                    <figure class="page3-img1"><div id="slideshow">
	[img]slide/verde/terra.jpg[/img]
	[img]slide/verde/fuoco.jpg[/img]
	[img]slide/verde/aria.jpg[/img]
	[img]slide/verde/acqua.jpg[/img]
</div></figure>
                                    <div class="extra-wrap" style="margin-top: 0px; border-top-width: 0px; padding-top: 54px;">
                                        <span>Verde In Velit Vel Ipsum Auctor Pulvinar</span>
                                        <p class="indent-bot">Congue fermentum auris accums an nulla vel diam. Sed in lacus ut enim adipiscing aliquet. Nulla venena tis. In pede mi, aliquet sit amet, euismod in, auctor ut, ligula. Aliquam dapibus tincidunt metus. Praesent justo dolor, lobortis quis, lobortis dignissim.</p>
    <p class="p10">Vestibulum sed ante. Donec sagittis euismod purus. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo.</p>
                                        <ul class="list1">[*]40-45m²[*]Balcony or terrace[*]Large bathroom with bathtub or shower[*]Separate WC[*]Room safe[*]One bedroom[*]Large living area[*]32" flatscreen TV, telephone, Wi-Fi[/list]
                                    </div>     
                                </div>
                              </div>
                              <div id="tab3" class="tab_content">
                                <div class="tab-bg"> 
                                    <figure class="page3-img1"><div id="slideshow">
	[img]slide/giallo/terra.jpg[/img]
	[img]slide/giallo/fuoco.jpg[/img]
	[img]slide/giallo/aria.jpg[/img]
	[img]slide/giallo/acqua.jpg[/img]
</div></figure>
                                    <div class="extra-wrap" style="margin-top: 0px; border-top-width: 0px; padding-top: 54px;">
                                        <span>Giallo In Velit Vel Ipsum Auctor Pulvinar</span>
                                        <p class="indent-bot">Congue fermentum auris accums an nulla vel diam. Sed in lacus ut enim adipiscing aliquet. Nulla venena tis. In pede mi, aliquet sit amet, euismod in, auctor ut, ligula. Aliquam dapibus tincidunt metus. Praesent justo dolor, lobortis quis, lobortis dignissim.</p>
    <p class="p10">Vestibulum sed ante. Donec sagittis euismod purus. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo.</p>
                                        <ul class="list1">[*]40-45m²[*]Balcony or terrace[*]Large bathroom with bathtub or shower[*]Separate WC[*]Room safe[*]One bedroom[*]Large living area[*]32" flatscreen TV, telephone, Wi-Fi[/list]
                                    </div>     
                                </div>
                              </div>
                              <div id="tab4" class="tab_content">
                                <div class="tab-bg"> 
                                    <figure class="page3-img1"><div id="slideshow">
	[img]slide/blu/terra.jpg[/img]
	[img]slide/blu/fuoco.jpg[/img]
	[img]slide/blu/aria.jpg[/img]
	[img]slide/blu/acqua.jpg[/img]
	
	
	
</div></figure>
                                    <div class="extra-wrap" style="margin-top: 0px; border-top-width: 0px; padding-top: 54px;">
                                        <span>Blu In Velit Vel Ipsum Auctor Pulvinar</span>
                                        <p class="indent-bot">Congue fermentum auris accums an nulla vel diam. Sed in lacus ut enim adipiscing aliquet. Nulla venena tis. In pede mi, aliquet sit amet, euismod in, auctor ut, ligula. Aliquam dapibus tincidunt metus. Praesent justo dolor, lobortis quis, lobortis dignissim.</p>
    <p class="p10">Vestibulum sed ante. Donec sagittis euismod purus. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo.</p>
                                        <ul class="list1">[*]40-45m²[*]Balcony or terrace[*]Large bathroom with bathtub or shower[*]Separate WC[*]Room safe[*]One bedroom[*]Large living area[*]32" flatscreen TV, telephone, Wi-Fi[/list]
                                    </div>     
                                </div>
                              </div>            
                              </div>
                          </div>
                        </div>
                    </article>
                </div>
                <div class="wrapper p13">
                    <article class="grid_4">
                            <div class="page1-box1">
                                <div class="inner">
                                    <div class="inner1">
                                        <h2>Wi-Fi</h2>
                                         <p class="p12">NEW! All our rooms now offer free wireless internet. The perfect way to check your emails while on holiday!</p> 
                                    </div>
                                </div>
                            </div>                        
                    </article>
                    <article class="grid_4">
                            <div class="page1-box1">
                                <div class="inner">
                                    <div class="inner1">
                                        <h2>rosa</h2>
                                       <p class="p12">Many of our rooms are equipped with flatscreen TVs, most with screen sizes between 27" and 32".</p>
                                    </div>
                                </div>
                            </div>                        
                    </article>
                    <article class="grid_4">
                            <div class="page1-box1">
                                <div class="inner">
                                    <div class="inner1">
                                        <h2>Keycard</h2>
                                        <p class="p12">Keys are a thing of the past! All guests at our hotel are provided with keycards to open and lock their rooms.</p>
                                    </div>
                                </div>
                            </div>                        
                    </article>
                </div>
            </div>
        </div>
    </section>

**Vincent.Zeno** · 07-08-2012, 12:23

stai usando una sintassi html5, spiega perché scrivi qui in (x)html

dov'è lo script che fa girare le immagini?

**Serex** · 07-08-2012, 13:26

sono 1 newbye scusa, ti incollo il codice java:

codice:

window.addEventListener?window.addEventListener('load',so_init,false):window.attachEvent('onload',so_init);

var d=document, imgs = new Array(), zInterval = null, current=0, pause=false;

function so_init()
{
	if(!d.getElementById || !d.createElement)return;

	css = d.createElement('link');
	css.setAttribute('href','slideshow2.css');
	css.setAttribute('rel','stylesheet');
	css.setAttribute('type','text/css');
	d.getElementsByTagName('head')[0].appendChild(css);

	imgs = d.getElementById('slideshow').getElementsByTagName('img');
	for(i=1;i<imgs.length;i++) imgs[i].xOpacity = 0;
	imgs[0].style.display = 'block';
	imgs[0].xOpacity = .99;

	setTimeout(so_xfade,3000);
}

function so_xfade()
{
	cOpacity = imgs[current].xOpacity;
	nIndex = imgs[current+1]?current+1:0;
	nOpacity = imgs[nIndex].xOpacity;

	cOpacity-=.05;
	nOpacity+=.05;

	imgs[nIndex].style.display = 'block';
	imgs[current].xOpacity = cOpacity;
	imgs[nIndex].xOpacity = nOpacity;

	setOpacity(imgs[current]);
	setOpacity(imgs[nIndex]);

	if(cOpacity<=0)
	{
		imgs[current].style.display = 'none';
		current = nIndex;
		setTimeout(so_xfade,3000);
	}
	else
	{
		setTimeout(so_xfade,50);
	}

	function setOpacity(obj)
	{
		if(obj.xOpacity>.99)
		{
			obj.xOpacity = .99;
			return;
		}

		obj.style.opacity = obj.xOpacity;
		obj.style.MozOpacity = obj.xOpacity;
		obj.style.filter = 'alpha(opacity=' + (obj.xOpacity*100) + ')';
	}
}

ti e sufficente?? o ti serve altro, se si dimmelo
ciao

**Vincent.Zeno** · 07-08-2012, 13:42

riepiloghiamo...

quello che devi muovere è questo:

codice:

<figure class="page3-img1"><div id="slideshow">
	[img]slide/verde/terra.jpg[/img]
	[img]slide/verde/fuoco.jpg[/img]
	[img]slide/verde/aria.jpg[/img]
	[img]slide/verde/acqua.jpg[/img]
</div></figure>

e lo fai tramite javascript, non java (che son cose diverse).
ho però l'impressione che tu abbia semplicemente inserito lo script (non si sa dove

spero in <head>) senza verificarne le funzionalità.
ti suggerisco di fare delle prove utilizzando gli esempi originali dal quale hai preso lo slider, così anche apprendi meglio il meccanismo

sposto su JS.

Discussione: slide non funzionante

Strumenti discussione

Ricerca discussione

Visualizza

slide non funzionante

sono 1 newbye scusa

Permessi di invio