Slider nel forum

Da JLK_perry2000_ Ven 10 Lug 2015 - 12:41

Salve a tutti, ho un problema con lo slider automatico in dissolvenza che tempo fa avevo inserito nel forum che tutt'ora gestisco. Prima sembrava funzionare; adesso che abbiamo deciso di cambiare la grafica, lo slider funziona sì, apparte i titoli, che non compaiono.
Il codice che utilizzo io è il seguente.

Spoiler:

                                                                                                             OltreConsole ha bisogno del tuo aiuto!

                                                                                                             La recensione di Darksiders II è già online!

                                                                                                             Il marketing nei videogiochi

                                                                                                             Nemesis II: the new generation

                                                                                                             Recensione Spiderman: il regno delle ombre

Slider automatico con dissolvenza by AngelNeo89

E il risultato è questo: https://i.servimg.com/u/f18/18/44/19/42/immagi10.png

Le immagini si vedono ma non si leggono i titoli. Dov'è che sbagliamo? C'è qualcosa di errato nel codice?
Grazie in anticipo Very Happy

e scusate se do fastidio con le mie domande Razz

Da **Niko** Ven 10 Lug 2015 - 12:50

Ciao,

ti dispiacerebbe inserire il codice all'interno del BBcode per i codici? altrimenti vedo il risultato e non il codice :bene:

Grazie

Da JLK_perry2000_ Ven 10 Lug 2015 - 12:59

Ciao, visto che non riesco con i BBcode, te lo posto qui: http://pastebin.com/EzsuAv1q
Infatti me ne ero accorto che si vedeva solamente il risultato, ma non riuscivo a risolvere Wink

Da **Niko** Ven 10 Lug 2015 - 13:18

Le prossime volte inseriscilo in questo modo:

Codice:: <br /> <style>#slider {width: 600px; height: 150px; margin: 1px auto 0; overflow:visible; background-color: rgba(255, 255, 255, .15); border: 5px solid rgba(255, 255, 255, .15); -moz-transition:all 150ms ease-in; -webkit-transition:all 150ms ease-in; -o-transition:all 150ms ease-in; position:relative; box-shadow: 0 1px 2px #AAA} #mask {width: 600px; height: 150px; overflow:hidden} #slider:hover {background-color: rgba(255, 255, 255, .8); border: 5px solid rgba(255, 255, 255, .8)} #slider:hover #pause {opacity: 1} #slider:hover ul, #slider:hover #overlay {-moz-animation-play-state:paused; -webkit-animation-play-state:paused} #overlay {width: 600px; height: 150px; position:absolute; top: 0; background-image:url(http://www.pikky.net/uploads/b0b030b3ef7fb61477ca57e7a181a2193d4dc0cb.png); background-position:center; background-repeat:no-repeat; pointer-events:none; -moz-transition:all 150ms ease-in; -webkit-transition:all 150ms ease-in; -o-transition:all 150ms ease-in; opacity: 0.3; -moz-animation:overlay-fade 18s infinite; -webkit-animation:overlay-fade 18s infinite} #slider ul {width: 600px; height: 750px; list-style:none; padding: 0; margin: 0; -webkit-animation:slide 25s infinite linear; -moz-animation:slide 25s infinite linear; -ms-animation:slide 25s infinite linear; -o-animation:slide 25s infinite linear; animation:slide 25s infinite linear position:relative; left: 0} #slider li {display:inline; width: 600px; height: 150px; margin: 0; padding: 0; float:left; position:relative; background-image:none; background-position: 50% 50%; background-repeat:no-repeat} #slider li:last-of-type {background-color: #C3C3C3} #slider li a {display:block; text-decoration:none} #slider li span {display:block; width: 600px; padding: 8px; position:absolute; bottom: 0; left: 0; background-color:rgba(54, 54, 54, 0.4); border-top: 1px solid rgba(0, 0, 0, .2); text-shadow: 1px 1px 1px #362C30; pointer-events:none; text-align:left; font-family: ubuntu, tahoma, geneva, sans-serif} #slider ul li span h2 {font-size: 14px; line-height: 23px; color: #FFF; font-weight:normal; text-align: center} /*Animazione*/ @-webkit-keyframes slide {/*FOTO 1*/ 0% {opacity: 0; -webkit-transform:translatey(0px)} 1% {opacity: 1; -webkit-transform:translatey(0px)} 15% {opacity: 1; -webkit-transform:translatey(0px)} 19% {opacity: 1; -webkit-transform:translatey(0px)} 20% {opacity: 0; -webkit-transform:translatey(0px)} /*FINE FOTO 1*/ /*FOTO 2*/ 21% {opacity: 0; -webkit-transform:translatey(-150px)} 22% {opacity: 1; -webkit-transform:translatey(-150px)} 35% {opacity: 1; -webkit-transform:translatey(-150px)} 39% {opacity: 1; -webkit-transform:translatey(-150px)} 40% {opacity: 0; -webkit-transform:translatey(-150px)} /*FINE FOTO 2*/ /*FOTO 3*/ 41% {opacity: 0; -webkit-transform:translatey(-300px)} 42% {opacity: 1; -webkit-transform:translatey(-300px)} 55% {opacity: 1; -webkit-transform:translatey(-300px)} 59% {opacity: 1; -webkit-transform:translatey(-300px)} 60% {opacity: 0; -webkit-transform:translatey(-300px)} /*FINE FOTO 3*/ /*FOTO 4*/ 61% {opacity: 0; -webkit-transform:translatey(-450px)} 62% {opacity: 1; -webkit-transform:translatey(-450px)} 75% {opacity: 1; -webkit-transform:translatey(-450px)} 79% {opacity: 1; -webkit-transform:translatey(-450px)} 80% {opacity: 0; -webkit-transform:translatey(-450px)} /*FINE FOTO 4*/ /*FOTO 5*/ 81% {opacity: 0; -webkit-transform:translatey(-600px)} 82% {opacity: 1; -webkit-transform:translatey(-600px)} 95% {opacity: 1; -webkit-transform:translatey(-600px)} 99% {opacity: 1; -webkit-transform:translatey(-600px)} 100% {opacity: 0; -webkit-transform:translatey(-600px)}} @-moz-keyframes slide {/*FOTO 1*/ 0% {opacity: 0; -moz-transform:translatey(0px)} 1% {opacity: 1; -moz-transform:translatey(0px)} 15% {opacity: 1; -moz-transform:translatey(0px)} 19% {opacity: 1; -moz-transform:translatey(0px)} 20% {opacity: 0; -moz-transform:translatey(0px)} /*FINE FOTO 1*/ /*FOTO 2*/ 21% {opacity: 0; -moz-transform:translatey(-150px)} 22% {opacity: 1; -moz-transform:translatey(-150px)} 35% {opacity: 1; -moz-transform:translatey(-150px)} 39% {opacity: 1; -moz-transform:translatey(-150px)} 40% {opacity: 0; -moz-transform:translatey(-150px)} /*FINE FOTO 2*/ /*FOTO 3*/ 41% {opacity: 0; -moz-transform:translatey(-300px)} 42% {opacity: 1; -moz-transform:translatey(-300px)} 55% {opacity: 1; -moz-transform:translatey(-300px)} 59% {opacity: 1; -moz-transform:translatey(-300px)} 60% {opacity: 0; -moz-transform:translatey(-300px)} /*FINE FOTO 3*/ /*FOTO 4*/ 61% {opacity: 0; -moz-transform:translatey(-450px)} 62% {opacity: 1; -moz-transform:translatey(-450px)} 75% {opacity: 1; -moz-transform:translatey(-450px)} 79% {opacity: 1; -moz-transform:translatey(-450px)} 80% {opacity: 0; -moz-transform:translatey(-450px)} /*FINE FOTO 4*/ /*FOTO 5*/ 81% {opacity: 0; -moz-transform:translatey(-600px)} 82% {opacity: 1; -moz-transform:translatey(-600px)} 95% {opacity: 1; -moz-transform:translatey(-600px)} 99% {opacity: 1; -moz-transform:translatey(-600px)} 100% {opacity: 0; -moz-transform:translatey(-600px)}} @-ms-keyframes slide {/*FOTO 1*/ 0% {opacity: 0; -ms-transform:translatey(0px)} 1% {opacity: 1; -ms-transform:translatey(0px)} 15% {opacity: 1; -ms-transform:translatey(0px)} 19% {opacity: 1; -ms-transform:translatey(0px)} 20% {opacity: 0; -ms-transform:translatey(0px)} /*FINE FOTO 1*/ /*FOTO 2*/ 21% {opacity: 0; -ms-transform:translatey(-150px)} 22% {opacity: 1; -ms-transform:translatey(-150px)} 35% {opacity: 1; -ms-transform:translatey(-150px)} 39% {opacity: 1; -ms-transform:translatey(-150px)} 40% {opacity: 0; -ms-transform:translatey(-150px)} /*FINE FOTO 2*/ /*FOTO 3*/ 41% {opacity: 0; -ms-transform:translatey(-300px)} 42% {opacity: 1; -ms-transform:translatey(-300px)} 55% {opacity: 1; -ms-transform:translatey(-300px)} 59% {opacity: 1; -ms-transform:translatey(-300px)} 60% {opacity: 0; -ms-transform:translatey(-300px)} /*FINE FOTO 3*/ /*FOTO 4*/ 61% {opacity: 0; -ms-transform:translatey(-450px)} 62% {opacity: 1; -ms-transform:translatey(-450px)} 75% {opacity: 1; -ms-transform:translatey(-450px)} 79% {opacity: 1; -ms-transform:translatey(-450px)} 80% {opacity: 0; -ms-transform:translatey(-450px)} /*FINE FOTO 4*/ /*FOTO 5*/ 81% {opacity: 0; -ms-transform:translatey(-600px)} 82% {opacity: 1; -ms-transform:translatey(-600px)} 95% {opacity: 1; -ms-transform:translatey(-600px)} 99% {opacity: 1; -ms-transform:translatey(-600px)} 100% {opacity: 0; -ms-transform:translatey(-600px)}} @-o-keyframes slide {/*FOTO 1*/ 0% {opacity: 0; -o-transform:translatey(0px)} 1% {opacity: 1; -o-transform:translatey(0px)} 15% {opacity: 1; -o-transform:translatey(0px)} 19% {opacity: 1; -o-transform:translatey(0px)} 20% {opacity: 0; -o-transform:translatey(0px)} /*FINE FOTO 1*/ /*FOTO 2*/ 21% {opacity: 0; -o-transform:translatey(-150px)} 22% {opacity: 1; -o-transform:translatey(-150px)} 35% {opacity: 1; -o-transform:translatey(-150px)} 39% {opacity: 1; -o-transform:translatey(-150px)} 40% {opacity: 0; -o-transform:translatey(-150px)} /*FINE FOTO 2*/ /*FOTO 3*/ 41% {opacity: 0; -o-transform:translatey(-300px)} 42% {opacity: 1; -o-transform:translatey(-300px)} 55% {opacity: 1; -o-transform:translatey(-300px)} 59% {opacity: 1; -o-transform:translatey(-300px)} 60% {opacity: 0; -o-transform:translatey(-300px)} /*FINE FOTO 3*/ /*FOTO 4*/ 61% {opacity: 0; -o-transform:translatey(-450px)} 62% {opacity: 1; -o-transform:translatey(-450px)} 75% {opacity: 1; -o-transform:translatey(-450px)} 79% {opacity: 1; -o-transform:translatey(-450px)} 80% {opacity: 0; -o-transform:translatey(-450px)} /*FINE FOTO 4*/ /*FOTO 5*/ 81% {opacity: 0; -o-transform:translatey(-600px)} 82% {opacity: 1; -o-transform:translatey(-600px)} 95% {opacity: 1; -o-transform:translatey(-600px)} 99% {opacity: 1; -o-transform:translatey(-600px)} 100% {opacity: 0; -o-transform:translatey(-600px)}} @keyframes slide {/*FOTO 1*/ 0% {opacity: 0; transform:translatey(0px)} 1% {opacity: 1; transform:translatey(0px)} 15% {opacity: 1; transform:translatey(0px)} 19% {opacity: 1; transform:translatey(0px)} 20% {opacity: 0; transform:translatey(0px)} /*FINE FOTO 1*/ /*FOTO 2*/ 21% {opacity: 0; transform:translatey(-150px)} 22% {opacity: 1; transform:translatey(-150px)} 35% {opacity: 1; transform:translatey(-150px)} 39% {opacity: 1; transform:translatey(-150px)} 40% {opacity: 0; transform:translatey(-150px)} /*FINE FOTO 2*/ /*FOTO 3*/ 41% {opacity: 0; transform:translatey(-300px)} 42% {opacity: 1; transform:translatey(-300px)} 55% {opacity: 1; transform:translatey(-300px)} 59% {opacity: 1; transform:translatey(-300px)} 60% {opacity: 0; transform:translatey(-300px)} /*FINE FOTO 3*/ /*FOTO 4*/ 61% {opacity: 0; transform:translatey(-450px)} 62% {opacity: 1; transform:translatey(-450px)} 75% {opacity: 1; transform:translatey(-450px)} 79% {opacity: 1; transform:translatey(-450px)} 80% {opacity: 0; transform:translatey(-450px)} /*FINE FOTO 4*/ /*FOTO 5*/ 81% {opacity: 0; transform:translatey(-600px)} 82% {opacity: 1; transform:translatey(-600px)} 95% {opacity: 1; transform:translatey(-600px)} 99% {opacity: 1; transform:translatey(-600px)} 100% {opacity: 0; transform:translatey(-600px)}} #creditiangelneo {float: right; font-size: 10px; font-style: italic; margin-right: 200px} </style> <div id="slider-shadow"> <div id="slider"> <div id="mask"> <ul> <li> <a title="OltreConsole ha bisogno del tuo aiuto!" href="http://oltreconsole.forumitaliano.com/f1-bacheca"><img src="http://i60.tinypic.com/wkw8y.jpg" /></a><span></span> <h2> OltreConsole ha bisogno del tuo aiuto! </h2><span></span> </li> <li> <a title="La recensione di Darksiders II è già online!" href="http://oltreconsole.forumitaliano.com/f34-zona-staff"><img src="http://i58.tinypic.com/rc9av8.png" /></a><span></span> <h2> La recensione di Darksiders II è già online! </h2><span></span> </li> <li> <a title="Il marketing nei videogiochi" href="http://oltreconsole.forumitaliano.com/f13-guide-e-recensioni"><img src="http://i58.tinypic.com/e7jij8.png" /></a><span></span> <h2> Il marketing nei videogiochi </h2><span></span> </li> <li> <a title="Nemesis II: the new generation" href="http://oltreconsole.forumitaliano.com/f5-telefonia"><img src="http://i57.tinypic.com/1ywqra.png" /></a> <span></span> <h2> Nemesis II: the new generation </h2><span></span> </li> <li> <a title="Recensione Spiderman: il regno delle ombre" href="http://oltreconsole.forumitaliano.com/f14-off-topic"><img src="http://i59.tinypic.com/dmd26w.png" /></a> <span></span> <h2> Recensione Spiderman: il regno delle ombre </h2><span></span> </li> </ul> </div> <div id="overlay"> </div> </div> <br /> <div id="creditiangelneo"> <a href="http://jackforum.forumcommunity.net/?t=52988244">Slider automatico con dissolvenza by AngelNeo89 </a> </div> </div>

in ogni caso, potresti darmi il link dove posso trovare lo slider?

Da JLK_perry2000_ Ven 10 Lug 2015 - 13:24

Niko ha scritto:Le prossime volte inseriscilo in questo modo:
Codice:
<br /> <style>#slider {width: 600px; height: 150px; margin: 1px auto 0; overflow:visible; background-color: rgba(255, 255, 255, .15); border: 5px solid rgba(255, 255, 255, .15); -moz-transition:all 150ms ease-in; -webkit-transition:all 150ms ease-in; -o-transition:all 150ms ease-in; position:relative; box-shadow: 0 1px 2px #AAA} #mask {width: 600px; height: 150px; overflow:hidden} #slider:hover {background-color: rgba(255, 255, 255, .8); border: 5px solid rgba(255, 255, 255, .8)} #slider:hover #pause {opacity: 1} #slider:hover ul, #slider:hover #overlay {-moz-animation-play-state:paused; -webkit-animation-play-state:paused} #overlay {width: 600px; height: 150px; position:absolute; top: 0; background-image:url(http://www.pikky.net/uploads/b0b030b3ef7fb61477ca57e7a181a2193d4dc0cb.png); background-position:center; background-repeat:no-repeat; pointer-events:none; -moz-transition:all 150ms ease-in; -webkit-transition:all 150ms ease-in; -o-transition:all 150ms ease-in; opacity: 0.3; -moz-animation:overlay-fade 18s infinite; -webkit-animation:overlay-fade 18s infinite} #slider ul {width: 600px; height: 750px; list-style:none; padding: 0; margin: 0; -webkit-animation:slide 25s infinite linear; -moz-animation:slide 25s infinite linear; -ms-animation:slide 25s infinite linear; -o-animation:slide 25s infinite linear; animation:slide 25s infinite linear position:relative; left: 0} #slider li {display:inline; width: 600px; height: 150px; margin: 0; padding: 0; float:left; position:relative; background-image:none; background-position: 50% 50%; background-repeat:no-repeat} #slider li:last-of-type {background-color: #C3C3C3} #slider li a {display:block; text-decoration:none} #slider li span {display:block; width: 600px; padding: 8px; position:absolute; bottom: 0; left: 0; background-color:rgba(54, 54, 54, 0.4); border-top: 1px solid rgba(0, 0, 0, .2); text-shadow: 1px 1px 1px #362C30; pointer-events:none; text-align:left; font-family: ubuntu, tahoma, geneva, sans-serif} #slider ul li span h2 {font-size: 14px; line-height: 23px; color: #FFF; font-weight:normal; text-align: center} /*Animazione*/ @-webkit-keyframes slide {/*FOTO 1*/ 0% {opacity: 0; -webkit-transform:translatey(0px)} 1% {opacity: 1; -webkit-transform:translatey(0px)} 15% {opacity: 1; -webkit-transform:translatey(0px)} 19% {opacity: 1; -webkit-transform:translatey(0px)} 20% {opacity: 0; -webkit-transform:translatey(0px)} /*FINE FOTO 1*/ /*FOTO 2*/ 21% {opacity: 0; -webkit-transform:translatey(-150px)} 22% {opacity: 1; -webkit-transform:translatey(-150px)} 35% {opacity: 1; -webkit-transform:translatey(-150px)} 39% {opacity: 1; -webkit-transform:translatey(-150px)} 40% {opacity: 0; -webkit-transform:translatey(-150px)} /*FINE FOTO 2*/ /*FOTO 3*/ 41% {opacity: 0; -webkit-transform:translatey(-300px)} 42% {opacity: 1; -webkit-transform:translatey(-300px)} 55% {opacity: 1; -webkit-transform:translatey(-300px)} 59% {opacity: 1; -webkit-transform:translatey(-300px)} 60% {opacity: 0; -webkit-transform:translatey(-300px)} /*FINE FOTO 3*/ /*FOTO 4*/ 61% {opacity: 0; -webkit-transform:translatey(-450px)} 62% {opacity: 1; -webkit-transform:translatey(-450px)} 75% {opacity: 1; -webkit-transform:translatey(-450px)} 79% {opacity: 1; -webkit-transform:translatey(-450px)} 80% {opacity: 0; -webkit-transform:translatey(-450px)} /*FINE FOTO 4*/ /*FOTO 5*/ 81% {opacity: 0; -webkit-transform:translatey(-600px)} 82% {opacity: 1; -webkit-transform:translatey(-600px)} 95% {opacity: 1; -webkit-transform:translatey(-600px)} 99% {opacity: 1; -webkit-transform:translatey(-600px)} 100% {opacity: 0; -webkit-transform:translatey(-600px)}} @-moz-keyframes slide {/*FOTO 1*/ 0% {opacity: 0; -moz-transform:translatey(0px)} 1% {opacity: 1; -moz-transform:translatey(0px)} 15% {opacity: 1; -moz-transform:translatey(0px)} 19% {opacity: 1; -moz-transform:translatey(0px)} 20% {opacity: 0; -moz-transform:translatey(0px)} /*FINE FOTO 1*/ /*FOTO 2*/ 21% {opacity: 0; -moz-transform:translatey(-150px)} 22% {opacity: 1; -moz-transform:translatey(-150px)} 35% {opacity: 1; -moz-transform:translatey(-150px)} 39% {opacity: 1; -moz-transform:translatey(-150px)} 40% {opacity: 0; -moz-transform:translatey(-150px)} /*FINE FOTO 2*/ /*FOTO 3*/ 41% {opacity: 0; -moz-transform:translatey(-300px)} 42% {opacity: 1; -moz-transform:translatey(-300px)} 55% {opacity: 1; -moz-transform:translatey(-300px)} 59% {opacity: 1; -moz-transform:translatey(-300px)} 60% {opacity: 0; -moz-transform:translatey(-300px)} /*FINE FOTO 3*/ /*FOTO 4*/ 61% {opacity: 0; -moz-transform:translatey(-450px)} 62% {opacity: 1; -moz-transform:translatey(-450px)} 75% {opacity: 1; -moz-transform:translatey(-450px)} 79% {opacity: 1; -moz-transform:translatey(-450px)} 80% {opacity: 0; -moz-transform:translatey(-450px)} /*FINE FOTO 4*/ /*FOTO 5*/ 81% {opacity: 0; -moz-transform:translatey(-600px)} 82% {opacity: 1; -moz-transform:translatey(-600px)} 95% {opacity: 1; -moz-transform:translatey(-600px)} 99% {opacity: 1; -moz-transform:translatey(-600px)} 100% {opacity: 0; -moz-transform:translatey(-600px)}} @-ms-keyframes slide {/*FOTO 1*/ 0% {opacity: 0; -ms-transform:translatey(0px)} 1% {opacity: 1; -ms-transform:translatey(0px)} 15% {opacity: 1; -ms-transform:translatey(0px)} 19% {opacity: 1; -ms-transform:translatey(0px)} 20% {opacity: 0; -ms-transform:translatey(0px)} /*FINE FOTO 1*/ /*FOTO 2*/ 21% {opacity: 0; -ms-transform:translatey(-150px)} 22% {opacity: 1; -ms-transform:translatey(-150px)} 35% {opacity: 1; -ms-transform:translatey(-150px)} 39% {opacity: 1; -ms-transform:translatey(-150px)} 40% {opacity: 0; -ms-transform:translatey(-150px)} /*FINE FOTO 2*/ /*FOTO 3*/ 41% {opacity: 0; -ms-transform:translatey(-300px)} 42% {opacity: 1; -ms-transform:translatey(-300px)} 55% {opacity: 1; -ms-transform:translatey(-300px)} 59% {opacity: 1; -ms-transform:translatey(-300px)} 60% {opacity: 0; -ms-transform:translatey(-300px)} /*FINE FOTO 3*/ /*FOTO 4*/ 61% {opacity: 0; -ms-transform:translatey(-450px)} 62% {opacity: 1; -ms-transform:translatey(-450px)} 75% {opacity: 1; -ms-transform:translatey(-450px)} 79% {opacity: 1; -ms-transform:translatey(-450px)} 80% {opacity: 0; -ms-transform:translatey(-450px)} /*FINE FOTO 4*/ /*FOTO 5*/ 81% {opacity: 0; -ms-transform:translatey(-600px)} 82% {opacity: 1; -ms-transform:translatey(-600px)} 95% {opacity: 1; -ms-transform:translatey(-600px)} 99% {opacity: 1; -ms-transform:translatey(-600px)} 100% {opacity: 0; -ms-transform:translatey(-600px)}} @-o-keyframes slide {/*FOTO 1*/ 0% {opacity: 0; -o-transform:translatey(0px)} 1% {opacity: 1; -o-transform:translatey(0px)} 15% {opacity: 1; -o-transform:translatey(0px)} 19% {opacity: 1; -o-transform:translatey(0px)} 20% {opacity: 0; -o-transform:translatey(0px)} /*FINE FOTO 1*/ /*FOTO 2*/ 21% {opacity: 0; -o-transform:translatey(-150px)} 22% {opacity: 1; -o-transform:translatey(-150px)} 35% {opacity: 1; -o-transform:translatey(-150px)} 39% {opacity: 1; -o-transform:translatey(-150px)} 40% {opacity: 0; -o-transform:translatey(-150px)} /*FINE FOTO 2*/ /*FOTO 3*/ 41% {opacity: 0; -o-transform:translatey(-300px)} 42% {opacity: 1; -o-transform:translatey(-300px)} 55% {opacity: 1; -o-transform:translatey(-300px)} 59% {opacity: 1; -o-transform:translatey(-300px)} 60% {opacity: 0; -o-transform:translatey(-300px)} /*FINE FOTO 3*/ /*FOTO 4*/ 61% {opacity: 0; -o-transform:translatey(-450px)} 62% {opacity: 1; -o-transform:translatey(-450px)} 75% {opacity: 1; -o-transform:translatey(-450px)} 79% {opacity: 1; -o-transform:translatey(-450px)} 80% {opacity: 0; -o-transform:translatey(-450px)} /*FINE FOTO 4*/ /*FOTO 5*/ 81% {opacity: 0; -o-transform:translatey(-600px)} 82% {opacity: 1; -o-transform:translatey(-600px)} 95% {opacity: 1; -o-transform:translatey(-600px)} 99% {opacity: 1; -o-transform:translatey(-600px)} 100% {opacity: 0; -o-transform:translatey(-600px)}} @keyframes slide {/*FOTO 1*/ 0% {opacity: 0; transform:translatey(0px)} 1% {opacity: 1; transform:translatey(0px)} 15% {opacity: 1; transform:translatey(0px)} 19% {opacity: 1; transform:translatey(0px)} 20% {opacity: 0; transform:translatey(0px)} /*FINE FOTO 1*/ /*FOTO 2*/ 21% {opacity: 0; transform:translatey(-150px)} 22% {opacity: 1; transform:translatey(-150px)} 35% {opacity: 1; transform:translatey(-150px)} 39% {opacity: 1; transform:translatey(-150px)} 40% {opacity: 0; transform:translatey(-150px)} /*FINE FOTO 2*/ /*FOTO 3*/ 41% {opacity: 0; transform:translatey(-300px)} 42% {opacity: 1; transform:translatey(-300px)} 55% {opacity: 1; transform:translatey(-300px)} 59% {opacity: 1; transform:translatey(-300px)} 60% {opacity: 0; transform:translatey(-300px)} /*FINE FOTO 3*/ /*FOTO 4*/ 61% {opacity: 0; transform:translatey(-450px)} 62% {opacity: 1; transform:translatey(-450px)} 75% {opacity: 1; transform:translatey(-450px)} 79% {opacity: 1; transform:translatey(-450px)} 80% {opacity: 0; transform:translatey(-450px)} /*FINE FOTO 4*/ /*FOTO 5*/ 81% {opacity: 0; transform:translatey(-600px)} 82% {opacity: 1; transform:translatey(-600px)} 95% {opacity: 1; transform:translatey(-600px)} 99% {opacity: 1; transform:translatey(-600px)} 100% {opacity: 0; transform:translatey(-600px)}} #creditiangelneo {float: right; font-size: 10px; font-style: italic; margin-right: 200px} </style> <div id="slider-shadow"> <div id="slider"> <div id="mask"> <ul> <li> <a title="OltreConsole ha bisogno del tuo aiuto!" href="http://oltreconsole.forumitaliano.com/f1-bacheca"><img src="http://i60.tinypic.com/wkw8y.jpg" /></a><span></span> <h2> OltreConsole ha bisogno del tuo aiuto! </h2><span></span> </li> <li> <a title="La recensione di Darksiders II è già online!" href="http://oltreconsole.forumitaliano.com/f34-zona-staff"><img src="http://i58.tinypic.com/rc9av8.png" /></a><span></span> <h2> La recensione di Darksiders II è già online! </h2><span></span> </li> <li> <a title="Il marketing nei videogiochi" href="http://oltreconsole.forumitaliano.com/f13-guide-e-recensioni"><img src="http://i58.tinypic.com/e7jij8.png" /></a><span></span> <h2> Il marketing nei videogiochi </h2><span></span> </li> <li> <a title="Nemesis II: the new generation" href="http://oltreconsole.forumitaliano.com/f5-telefonia"><img src="http://i57.tinypic.com/1ywqra.png" /></a> <span></span> <h2> Nemesis II: the new generation </h2><span></span> </li> <li> <a title="Recensione Spiderman: il regno delle ombre" href="http://oltreconsole.forumitaliano.com/f14-off-topic"><img src="http://i59.tinypic.com/dmd26w.png" /></a> <span></span> <h2> Recensione Spiderman: il regno delle ombre </h2><span></span> </li> </ul> </div> <div id="overlay"> </div> </div> <br /> <div id="creditiangelneo"> <a href="http://jackforum.forumcommunity.net/?t=52988244">Slider automatico con dissolvenza by AngelNeo89 </a> </div> </div>

in ogni caso, potresti darmi il link dove posso trovare lo slider?

Scusa, non capisco la domanda Sad

Il codice mi era stato postato da "the crew" qui: https://aiuto.forumattivo.it/t17412-slider-automatico-in-dissolvenza?highlight=slider+automatico+in+dissolvenza
Originariamente funzionava, adesso non capisco perchè non funge!
PS: il codice si trovava inizialmente su forumcommunity

Spoiler:

Da **Niko** Ven 10 Lug 2015 - 13:32

nono, volevo sapere dove lo hai inserito.. e se potessi fornirmi il link della pagina dove lo hai inserito :bene:

così controllo dal vivo

Da JLK_perry2000_ Ven 10 Lug 2015 - 13:37

Ah okay... l'ho inserito in PDA>>visualizzazione>>prima pagina>>generalità.
Il forum è

questo:

Lo metto in spoiler per non spammare Razz

Da the crow Ven 10 Lug 2015 - 20:49

Codice:: <style>#slider {width: 600px; height: 150px; margin: 1px auto 0; overflow:visible; background-color: rgba(255, 255, 255, .15); border: 5px solid rgba(255, 255, 255, .15); -moz-transition:all 150ms ease-in; -webkit-transition:all 150ms ease-in; -o-transition:all 150ms ease-in; position:relative; box-shadow: 0 1px 2px #AAA} #mask {width: 600px; height: 150px; overflow:hidden} #slider:hover {background-color: rgba(255, 255, 255, .8); border: 5px solid rgba(255, 255, 255, .8)} #slider:hover #pause {opacity: 1} #slider:hover ul, #slider:hover #overlay {-moz-animation-play-state:paused; -webkit-animation-play-state:paused} #overlay {width: 600px; height: 150px; position:absolute; top: 0; background-image:url(http://www.pikky.net/uploads/b0b030b3ef7fb61477ca57e7a181a2193d4dc0cb.png); background-position:center; background-repeat:no-repeat; pointer-events:none; -moz-transition:all 150ms ease-in; -webkit-transition:all 150ms ease-in; -o-transition:all 150ms ease-in; opacity: 0.3; -moz-animation:overlay-fade 18s infinite; -webkit-animation:overlay-fade 18s infinite} #slider ul {width: 600px; height: 750px; list-style:none; padding: 0; margin: 0; -webkit-animation:slide 25s infinite linear; -moz-animation:slide 25s infinite linear; -ms-animation:slide 25s infinite linear; -o-animation:slide 25s infinite linear; animation:slide 25s infinite linear position:relative; left: 0} #slider li {display:inline; width: 600px; height: 150px; margin: 0; padding: 0; float:left; position:relative; background-image:none; background-position: 50% 50%; background-repeat:no-repeat} #slider li:last-of-type {background-color: #C3C3C3} #slider li a {display:block; text-decoration:none} #slider li span {display:block; width: 600px; padding: 8px; position:absolute; bottom: 0; left: 0; background-color:rgba(54, 54, 54, 0.4); border-top: 1px solid rgba(0, 0, 0, .2); text-shadow: 1px 1px 1px #362C30; pointer-events:none; text-align:left; font-family: ubuntu, tahoma, geneva, sans-serif} #slider ul li span h2 {font-size: 14px; line-height: 23px; color: #FFF; font-weight:normal; text-align: center} /*Animazione*/ @-webkit-keyframes slide {/*FOTO 1*/ 0% {opacity: 0; -webkit-transform:translatey(0px)} 1% {opacity: 1; -webkit-transform:translatey(0px)} 15% {opacity: 1; -webkit-transform:translatey(0px)} 19% {opacity: 1; -webkit-transform:translatey(0px)} 20% {opacity: 0; -webkit-transform:translatey(0px)} /*FINE FOTO 1*/ /*FOTO 2*/ 21% {opacity: 0; -webkit-transform:translatey(-150px)} 22% {opacity: 1; -webkit-transform:translatey(-150px)} 35% {opacity: 1; -webkit-transform:translatey(-150px)} 39% {opacity: 1; -webkit-transform:translatey(-150px)} 40% {opacity: 0; -webkit-transform:translatey(-150px)} /*FINE FOTO 2*/ /*FOTO 3*/ 41% {opacity: 0; -webkit-transform:translatey(-300px)} 42% {opacity: 1; -webkit-transform:translatey(-300px)} 55% {opacity: 1; -webkit-transform:translatey(-300px)} 59% {opacity: 1; -webkit-transform:translatey(-300px)} 60% {opacity: 0; -webkit-transform:translatey(-300px)} /*FINE FOTO 3*/ /*FOTO 4*/ 61% {opacity: 0; -webkit-transform:translatey(-450px)} 62% {opacity: 1; -webkit-transform:translatey(-450px)} 75% {opacity: 1; -webkit-transform:translatey(-450px)} 79% {opacity: 1; -webkit-transform:translatey(-450px)} 80% {opacity: 0; -webkit-transform:translatey(-450px)} /*FINE FOTO 4*/ /*FOTO 5*/ 81% {opacity: 0; -webkit-transform:translatey(-600px)} 82% {opacity: 1; -webkit-transform:translatey(-600px)} 95% {opacity: 1; -webkit-transform:translatey(-600px)} 99% {opacity: 1; -webkit-transform:translatey(-600px)} 100% {opacity: 0; -webkit-transform:translatey(-600px)}} @-moz-keyframes slide {/*FOTO 1*/ 0% {opacity: 0; -moz-transform:translatey(0px)} 1% {opacity: 1; -moz-transform:translatey(0px)} 15% {opacity: 1; -moz-transform:translatey(0px)} 19% {opacity: 1; -moz-transform:translatey(0px)} 20% {opacity: 0; -moz-transform:translatey(0px)} /*FINE FOTO 1*/ /*FOTO 2*/ 21% {opacity: 0; -moz-transform:translatey(-150px)} 22% {opacity: 1; -moz-transform:translatey(-150px)} 35% {opacity: 1; -moz-transform:translatey(-150px)} 39% {opacity: 1; -moz-transform:translatey(-150px)} 40% {opacity: 0; -moz-transform:translatey(-150px)} /*FINE FOTO 2*/ /*FOTO 3*/ 41% {opacity: 0; -moz-transform:translatey(-300px)} 42% {opacity: 1; -moz-transform:translatey(-300px)} 55% {opacity: 1; -moz-transform:translatey(-300px)} 59% {opacity: 1; -moz-transform:translatey(-300px)} 60% {opacity: 0; -moz-transform:translatey(-300px)} /*FINE FOTO 3*/ /*FOTO 4*/ 61% {opacity: 0; -moz-transform:translatey(-450px)} 62% {opacity: 1; -moz-transform:translatey(-450px)} 75% {opacity: 1; -moz-transform:translatey(-450px)} 79% {opacity: 1; -moz-transform:translatey(-450px)} 80% {opacity: 0; -moz-transform:translatey(-450px)} /*FINE FOTO 4*/ /*FOTO 5*/ 81% {opacity: 0; -moz-transform:translatey(-600px)} 82% {opacity: 1; -moz-transform:translatey(-600px)} 95% {opacity: 1; -moz-transform:translatey(-600px)} 99% {opacity: 1; -moz-transform:translatey(-600px)} 100% {opacity: 0; -moz-transform:translatey(-600px)}} @-ms-keyframes slide {/*FOTO 1*/ 0% {opacity: 0; -ms-transform:translatey(0px)} 1% {opacity: 1; -ms-transform:translatey(0px)} 15% {opacity: 1; -ms-transform:translatey(0px)} 19% {opacity: 1; -ms-transform:translatey(0px)} 20% {opacity: 0; -ms-transform:translatey(0px)} /*FINE FOTO 1*/ /*FOTO 2*/ 21% {opacity: 0; -ms-transform:translatey(-150px)} 22% {opacity: 1; -ms-transform:translatey(-150px)} 35% {opacity: 1; -ms-transform:translatey(-150px)} 39% {opacity: 1; -ms-transform:translatey(-150px)} 40% {opacity: 0; -ms-transform:translatey(-150px)} /*FINE FOTO 2*/ /*FOTO 3*/ 41% {opacity: 0; -ms-transform:translatey(-300px)} 42% {opacity: 1; -ms-transform:translatey(-300px)} 55% {opacity: 1; -ms-transform:translatey(-300px)} 59% {opacity: 1; -ms-transform:translatey(-300px)} 60% {opacity: 0; -ms-transform:translatey(-300px)} /*FINE FOTO 3*/ /*FOTO 4*/ 61% {opacity: 0; -ms-transform:translatey(-450px)} 62% {opacity: 1; -ms-transform:translatey(-450px)} 75% {opacity: 1; -ms-transform:translatey(-450px)} 79% {opacity: 1; -ms-transform:translatey(-450px)} 80% {opacity: 0; -ms-transform:translatey(-450px)} /*FINE FOTO 4*/ /*FOTO 5*/ 81% {opacity: 0; -ms-transform:translatey(-600px)} 82% {opacity: 1; -ms-transform:translatey(-600px)} 95% {opacity: 1; -ms-transform:translatey(-600px)} 99% {opacity: 1; -ms-transform:translatey(-600px)} 100% {opacity: 0; -ms-transform:translatey(-600px)}} @-o-keyframes slide {/*FOTO 1*/ 0% {opacity: 0; -o-transform:translatey(0px)} 1% {opacity: 1; -o-transform:translatey(0px)} 15% {opacity: 1; -o-transform:translatey(0px)} 19% {opacity: 1; -o-transform:translatey(0px)} 20% {opacity: 0; -o-transform:translatey(0px)} /*FINE FOTO 1*/ /*FOTO 2*/ 21% {opacity: 0; -o-transform:translatey(-150px)} 22% {opacity: 1; -o-transform:translatey(-150px)} 35% {opacity: 1; -o-transform:translatey(-150px)} 39% {opacity: 1; -o-transform:translatey(-150px)} 40% {opacity: 0; -o-transform:translatey(-150px)} /*FINE FOTO 2*/ /*FOTO 3*/ 41% {opacity: 0; -o-transform:translatey(-300px)} 42% {opacity: 1; -o-transform:translatey(-300px)} 55% {opacity: 1; -o-transform:translatey(-300px)} 59% {opacity: 1; -o-transform:translatey(-300px)} 60% {opacity: 0; -o-transform:translatey(-300px)} /*FINE FOTO 3*/ /*FOTO 4*/ 61% {opacity: 0; -o-transform:translatey(-450px)} 62% {opacity: 1; -o-transform:translatey(-450px)} 75% {opacity: 1; -o-transform:translatey(-450px)} 79% {opacity: 1; -o-transform:translatey(-450px)} 80% {opacity: 0; -o-transform:translatey(-450px)} /*FINE FOTO 4*/ /*FOTO 5*/ 81% {opacity: 0; -o-transform:translatey(-600px)} 82% {opacity: 1; -o-transform:translatey(-600px)} 95% {opacity: 1; -o-transform:translatey(-600px)} 99% {opacity: 1; -o-transform:translatey(-600px)} 100% {opacity: 0; -o-transform:translatey(-600px)}} @keyframes slide {/*FOTO 1*/ 0% {opacity: 0; transform:translatey(0px)} 1% {opacity: 1; transform:translatey(0px)} 15% {opacity: 1; transform:translatey(0px)} 19% {opacity: 1; transform:translatey(0px)} 20% {opacity: 0; transform:translatey(0px)} /*FINE FOTO 1*/ /*FOTO 2*/ 21% {opacity: 0; transform:translatey(-150px)} 22% {opacity: 1; transform:translatey(-150px)} 35% {opacity: 1; transform:translatey(-150px)} 39% {opacity: 1; transform:translatey(-150px)} 40% {opacity: 0; transform:translatey(-150px)} /*FINE FOTO 2*/ /*FOTO 3*/ 41% {opacity: 0; transform:translatey(-300px)} 42% {opacity: 1; transform:translatey(-300px)} 55% {opacity: 1; transform:translatey(-300px)} 59% {opacity: 1; transform:translatey(-300px)} 60% {opacity: 0; transform:translatey(-300px)} /*FINE FOTO 3*/ /*FOTO 4*/ 61% {opacity: 0; transform:translatey(-450px)} 62% {opacity: 1; transform:translatey(-450px)} 75% {opacity: 1; transform:translatey(-450px)} 79% {opacity: 1; transform:translatey(-450px)} 80% {opacity: 0; transform:translatey(-450px)} /*FINE FOTO 4*/ /*FOTO 5*/ 81% {opacity: 0; transform:translatey(-600px)} 82% {opacity: 1; transform:translatey(-600px)} 95% {opacity: 1; transform:translatey(-600px)} 99% {opacity: 1; transform:translatey(-600px)} 100% {opacity: 0; transform:translatey(-600px)}} #creditiangelneo {float: right; font-size: 10px; font-style: italic; margin-right: 200px} </style> <div id="slider-shadow"> <div id="slider"> <div id="mask"> <ul> <li> <a title="OltreConsole ha bisogno del tuo aiuto!" href="http://oltreconsole.forumitaliano.com/f1-bacheca"><img src="http://i60.tinypic.com/wkw8y.jpg" /></a> <span><h2> OltreConsole ha bisogno del tuo aiuto! </h2></span> </li> <li> <a title="La recensione di Darksiders II è già online!" href="http://oltreconsole.forumitaliano.com/f34-zona-staff"><img src="http://i58.tinypic.com/rc9av8.png" /></a> <span><h2> La recensione di Darksiders II è già online! </h2></span> </li> <li> <a title="Il marketing nei videogiochi" href="http://oltreconsole.forumitaliano.com/f13-guide-e-recensioni"><img src="http://i58.tinypic.com/e7jij8.png" /></a> <span><h2> Il marketing nei videogiochi </h2></span> </li> <li> <a title="Nemesis II: the new generation" href="http://oltreconsole.forumitaliano.com/f5-telefonia"><img src="http://i57.tinypic.com/1ywqra.png" /></a> <span><h2> Nemesis II: the new generation </h2></span> </li> <li> <a title="Recensione Spiderman: il regno delle ombre" href="http://oltreconsole.forumitaliano.com/f14-off-topic"><img src="http://i59.tinypic.com/dmd26w.png" /></a> <span><h2> Recensione Spiderman: il regno delle ombre </h2></span> </li> </ul> </div> <div id="overlay"> </div> </div> <br /> <div id="creditiangelneo"> <a href="http://jackforum.forumcommunity.net/?t=52988244">Slider automatico con dissolvenza by AngelNeo89 </a> </div> </div>

Da JLK_perry2000_ Ven 10 Lug 2015 - 21:25

Grazie mille the crow.
Grazie anche a Niko, sempre gentilissimi Razz

Se volessi magari ingrandire o cambiare font, come potrei fare?

Da JLK_perry2000_ Ven 10 Lug 2015 - 21:36

Sto impazzendo. Funziona, però certe volte all'improvviso non si vedono più i titoli.
Per esempio, adesso stavo cambiando i link e non si legge più niente!
Prima avevo fatto qualche modifica, non mi soddidfava e avevo rimesso il code originale. Non funzionava proprio. Ma sono io che sbaglio a fare qualcosa? Quindi, riprovato più volte a rimettere lo stesso code, alla fine ci sono riuscito .-.

EDIT: per farvi capire meglio; adesso i titoli si vedevano e tutto funzionava alla perfezione. Ho semplicemente cliccato il tasto "Oscillare il modo d'edizione" e puf, niente scritte .-.

Da the crow Sab 11 Lug 2015 - 17:57

-dove si trova il link di cui parli

Da JLK_perry2000_ Dom 12 Lug 2015 - 11:48

Intendo i link che vanno sostituiti a quelli che già ci sono per aggiornare lo slider. Sembra quasi che faccia da solo! Clicco il tasto "Oscillare il modo d'edizione" e si levano i titoli. Il tasto non modifca niente a livello di code, eppure smette di funzionare se faccio così...

Da JLK_perry2000_ Dom 12 Lug 2015 - 12:10

Okay the crow. Forse ho capito cos'è che sbagliavo. Modificavo il code dal PDA e salvavo le modifiche.
Adesso ho provato a modificarlo su un blocco note e poi ad inserirlo nuovamente, ed ha funzionato.
Grazie per la pazienza! Se possibile chiedo comunque di non chiudere il topic per altri 1-2 giorni Razz

Grazie a tutti!!! happy

Da **MattiaDes** Sab 1 Ago 2015 - 15:46

@JLK_perry2000_ possiamo archiviare il topic? happy

Da **MattiaDes** Sab 24 Ott 2015 - 11:20

.

.

Caro utente,

questo problema è stato considerato abbandonato.

Purtroppo, secondo il nostro regolamento, se l'argomento non riceve risposta da più di 7 giorni, viene considerato risolto o abbandonato.
Nei prossimi topic di supporto che aprirai:

Se il problema non è risolto
dovrai fare un messaggio di UP dopo 24 ore dal tuo ultimo messaggio cosi da riportare il problema agli occhi del personale
Se il problema è risolto
è necessario premere sul bottone così da inserire l'icona risolto e facilitare il lavoro del personale