Vari problemi
4 partecipanti
Forum dei Forum: Aiuto per Forumattivo :: Assistenza a problemi e richieste :: Problemi con uno script o codici :: I problemi risolti con i codici :: Argomenti chiusi con i codici
Pagina 1 di 1 • Condividi
Vari problemi
Ciao a tutti,
io sulla mia pagina web ho creato questo slide: http://mydashboard.altervista.org/slide/demo.html
Il problema è che, tramite un frame vorrei portarlo sul mio forum senza bordo bianco e senza la scrollbar, cioè così:
![Vari problemi Scherm10](https://i.servimg.com/u/f47/16/07/03/89/scherm10.jpg)
Un'altra domanda, il codice dello slide è questo:
Io vorrei aumentare il tempo di traslazione tra un'immagine e un'altra, come si può fare?
Grazie mille :)
io sulla mia pagina web ho creato questo slide: http://mydashboard.altervista.org/slide/demo.html
Il problema è che, tramite un frame vorrei portarlo sul mio forum senza bordo bianco e senza la scrollbar, cioè così:
![Vari problemi Scherm10](https://i.servimg.com/u/f47/16/07/03/89/scherm10.jpg)
Un'altra domanda, il codice dello slide è questo:
- Codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="it">
<head>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="it" />
<meta name="Robots" content="All" />
<meta name="Description" content="HTML.it - il sito italiano sul Web publishing" />
<meta name="Keywords" content="javascript" />
<meta name="Owner" content="HTML.it srl" />
<meta name="Author" content="HTML.it srl" />
<meta name="Copyright" content="HTML.it srl" />
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/coin-slider.min.js"></script>
<link rel="stylesheet" href="css/styles.css" type="text/css" />
<link rel="stylesheet" href="css/coin-slider-styles.css" type="text/css" />
</head>
<body>
<div id="page">
<div id="gamesHolder">
<div id="games">
<a href="http://www.minininjas.com/" target="_blank">
<img src="games/mini_ninjas.jpg" alt="Mini Ninjas" />
<span>
<b>Mini Ninjas</b><br />
Your quest to defeat the Evil Samurai Warlord has begun. Control the powers of nature, possess creatures, use your
furious Ninja skills to free your Ninja friends.
</span>
</a>
<a href="http://www.princeofpersiagame.com/" target="_blank">
<img src="games/prince_of_persia.jpg" alt="Price of Persia" />
<span><b> Leonardo</b><br />
</span>
</a>
<a href="http://spidermandimensions.marvel.com/" target="_blank">
<img src="games/spiderman_shattered_dimensions.jpg" alt="Spiderman: Shattered Dimensions" />
</a>
<a href="http://brinkthegame.com/" target="_blank">
<img src="games/brink.jpg" alt="Brink" />
</a>
<a href="http://www.godofwar.com/" target="_blank" >
<img src="games/god_of_war_3.jpg" alt="God of War III" />
</a>
<a href="http://www.borderlandsthegame.com/" target="_blank">
<img src="games/borderlands.jpg" alt="Borderlands" />
<span>
<b>Borderlands</b><br />
Fun combat and a steady flow of rewards make this journey a massively enjoyable one, especially with some fellow mercenaries along for the ride.
</span>
</a>
<a href="http://www.swtor.com/" target="_blank">
<img src="games/star_wars_the_old_republic.jpg" alt="Star Wars: The Old Republic" />
</a>
<a href="http://www.batmanarkhamasylum.com/" target="_blank">
<img src="games/batman_arkham_asylum.jpg" alt="Batman: Arkham Asylum" />
</a>
</div>
</div>
<script>$(document).ready(function() {
$('#games').coinslider({ hoverPause: true });
});
</script>
Io vorrei aumentare il tempo di traslazione tra un'immagine e un'altra, come si può fare?
Grazie mille :)
Re: Vari problemi
Per il tempo prova a cambiare questo valore
Per l'iframe senza scrollbar fammi pensare un po su e poi ti rifaccio sapere
- Codice:
jquery-1.4.2.min.
Per l'iframe senza scrollbar fammi pensare un po su e poi ti rifaccio sapere
Dozy™- Veterano dello staff
- Sesso :
Età : 36
Messaggi : 2297
Località : Tradate (va)
Re: Vari problemi
trovi la risposta nella documentazione ufficiale del plugin..
http://workshop.rs/2010/04/coin-slider-image-slider-with-unique-effects/
comunque sostituisci
per portarlo sul tuo forum ti basta far caricare il plugin nel tuo forum con il relativo CSS, ovvero, dopo aver scritto l'HTML delle immagini, metti questo codice:
NB:- lo script non funziona se non implementi nella pagina le librerie jQuery, ma sono già incluse nel forum, quindi non ce ne è bisogno, ma se ce ne fosse bisogno, aggiungi prima dello script questo codice:
se hai bisogno di altro chiedi pure..![happy](/users/3112/53/90/27/smiles/2632293392.gif)
EDIT:- la soluzione dell'iframe è molto allettante, di conseguenza ti basta usare questo codice:
http://workshop.rs/2010/04/coin-slider-image-slider-with-unique-effects/
comunque sostituisci
- Codice:
<script>$(document).ready(function() {
$('#games').coinslider({ hoverPause: true });
});
</script>
- Codice:
<script>$(document).ready(function() {
$('#games').coinslider({ hoverPause: true, delay: 5000 });
});
</script>
![Wink](https://2img.net/i/fa/i/smiles/icon_wink.gif)
per portarlo sul tuo forum ti basta far caricare il plugin nel tuo forum con il relativo CSS, ovvero, dopo aver scritto l'HTML delle immagini, metti questo codice:
- Codice:
<style type="text/css">
#page { width: 575px; margin: 30px auto; }
#gamesHolder { padding: 5px; margin-top: 30px; width: 565px; }
#header { text-align: center; }
#header h1 { color: #333333; font-size: 50px; }
#header h2 { color: #333333; font-size: 30px; }
a { text-decoration: none;}
.customFont {
font-family: 'Pompiere', Verdana, cursive;
font-size: 18px;
}
#header h1, #header h2 { margin: 0; padding: 0; font-weight: normal; }
ul { padding: 0 0 0 15px; margin: 0; }
.holder { padding: 17px 5px; border-radius: 5px; box-shadow: 0px 0px 3px #CCC; }
.text { background-color: #f3f3f3; padding: 20px; line-height: 20px; overflow: hidden; zoom: 1; }
.holder h2 { margin: 0; padding: 0px 0px 15px 0px; }
code { display: block; background-color: #fff; padding: 10px; overflow: auto; }
pre { margin: 10px 0px; padding: 0; }
.h2 {
font-weight: normal;
display: none;
}
.button a {
background: #0B5B60;
margin: 10px 100px;
opacity: 1;
outline: medium none;
padding: 5px ;
text-align: center;
text-decoration: none;
display: block;
line-height: 50px;
background: #599BDC;
background: -webkit-linear-gradient(top, #599BDC, #3072B3); /* webkit browsers */
background: -moz-linear-gradient(top, #599BDC, #3072B3); /* firefox 3.6+ */
background: -o-linear-gradient(top, #599BDC, #3072B3); /* opera */
background: -ms-linear-gradient(top, #599BDC, #3072B3); /* IE10 */
background: linear-gradient(top, #599BDC, #3072B3); /* css3 */
border: 1px solid #518CC6;
color: #FFFFFF;
text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.3);
border-radius: 5px;
}
.button a:hover {
background: #3072B3;
background: -webkit-linear-gradient(top, #3072B3, #599BDC); /* webkit browsers */
background: -moz-linear-gradient(top, #3072B3, #599BDC); /* firefox 3.6+ */
background: -o-linear-gradient(top, #3072B3, #599BDC); /* opera */
background: -ms-linear-gradient(top, #3072B3, #599BDC); /* IE10 */
background: linear-gradient(top, #3072B3, #599BDC); /* css3 */
box-shadow: 0 0 3px #518CC6;
}
.bar {
background-color: #111;
color: #f0f0f0;
box-shadow: 0px 0px 2px #333;
line-height: 25px;
padding: 0px 20px;
position: fixed;
top: 0;
right: 0;
left: 0;
z-index: 10000;
}
.bar a {
color: #DDD;
}
.bar a:hover {
color: #FFFFFF;
}
#download {
clear: both;
}
#download .button {
font-size: 22px;
}
#features ul {
overflow: hidden;
zoom: 1;
margin: 15px;
}
#features li {
width: 50%;
float: left;
}
/** Coin Slider additional styles **/
.cs-buttons a {
border-radius: 50%;
background: #CCC;
background: -webkit-linear-gradient(top, #CCCCCC, #F3F3F3); /* webkit browsers */
background: -moz-linear-gradient(top, #CCCCCC, #F3F3F3); /* firefox 3.6+ */
background: -o-linear-gradient(top, #CCCCCC, #F3F3F3); /* opera */
background: -ms-linear-gradient(top, #CCCCCC, #F3F3F3); /* IE10 */
background: linear-gradient(top, #CCCCCC, #F3F3F3); /* css3 */
}
a.cs-active {
background: #599BDC;
background: -webkit-linear-gradient(top, #599BDC, #3072B3); /* webkit browsers */
background: -moz-linear-gradient(top, #599BDC, #3072B3); /* firefox 3.6+ */
background: -o-linear-gradient(top, #599BDC, #3072B3); /* opera */
background: -ms-linear-gradient(top, #599BDC, #3072B3); /* IE10 */
background: linear-gradient(top, #599BDC, #3072B3); /* css3 */
border-radius: 50%;
box-shadow: 0 0 3px #518CC6;
border: 1px solid #3072B3 !important;
}
.coin-slider { overflow: hidden; zoom: 1; position: relative; }
.coin-slider a{ text-decoration: none; outline: none; border: none; }
.cs-buttons { font-size: 0px; padding: 10px; float: left; }
.cs-buttons a { margin-left: 5px; height: 10px; width: 10px; float: left; border: 1px solid #B8C4CF; color: #B8C4CF; text-indent: -1000px; }
.cs-active { background-color: #B8C4CF; color: #FFFFFF; }
.cs-title { width: 545px; padding: 10px; background-color: #000000; color: #FFFFFF; }
.cs-prev,
.cs-next { background-color: #000000; color: #FFFFFF; padding: 0px 10px; }
</style>
<script>
(function(jQuery){var params=new Array;var order=new Array;var images=new Array;var links=new Array;var linksTarget=new Array;var titles=new Array;var interval=new Array;var imagePos=new Array;var appInterval=new Array;var squarePos=new Array;var reverse=new Array;jQuery.fn.coinslider=jQuery.fn.CoinSlider=function(options){init=function(el){order[el.id]=new Array();images[el.id]=new Array();links[el.id]=new Array();linksTarget[el.id]=new Array();titles[el.id]=new Array();imagePos[el.id]=0;squarePos[el.id]=0;reverse[el.id]=1;params[el.id]=jQuery.extend({},jQuery.fn.coinslider.defaults,options);jQuery.each(jQuery('#'+el.id+' img'),function(i,item){images[el.id][i]=jQuery(item).attr('src');links[el.id][i]=jQuery(item).parent().is('a')?jQuery(item).parent().attr('href'):'';linksTarget[el.id][i]=jQuery(item).parent().is('a')?jQuery(item).parent().attr('target'):'';titles[el.id][i]=jQuery(item).next().is('span')?jQuery(item).next().html():'';jQuery(item).hide();jQuery(item).next().hide();});jQuery(el).css({'background-image':'url('+images[el.id][0]+')','width':params[el.id].width,'height':params[el.id].height,'position':'relative','background-position':'top left'}).wrap("<div class='coin-slider' id='coin-slider-"+el.id+"' />");jQuery('#'+el.id).append("<div class='cs-title' id='cs-title-"+el.id+"' style='position: absolute; bottom:0; left: 0; z-index: 1000;'></div>");jQuery.setFields(el);if(params[el.id].navigation)
jQuery.setNavigation(el);jQuery.transition(el,0);jQuery.transitionCall(el);}
jQuery.setFields=function(el){tWidth=sWidth=parseInt(params[el.id].width/params[el.id].spw);tHeight=sHeight=parseInt(params[el.id].height/params[el.id].sph);counter=sLeft=sTop=0;tgapx=gapx=params[el.id].width-params[el.id].spw*sWidth;tgapy=gapy=params[el.id].height-params[el.id].sph*sHeight;for(i=1;i<=params[el.id].sph;i++){gapx=tgapx;if(gapy>0){gapy--;sHeight=tHeight+1;}else{sHeight=tHeight;}
for(j=1;j<=params[el.id].spw;j++){if(gapx>0){gapx--;sWidth=tWidth+1;}else{sWidth=tWidth;}
order[el.id][counter]=i+''+j;counter++;if(params[el.id].links)
jQuery('#'+el.id).append("<a href='"+links[el.id][0]+"' class='cs-"+el.id+"' id='cs-"+el.id+i+j+"' style='width:"+sWidth+"px; height:"+sHeight+"px; float: left; position: absolute;'></a>");else
jQuery('#'+el.id).append("<div class='cs-"+el.id+"' id='cs-"+el.id+i+j+"' style='width:"+sWidth+"px; height:"+sHeight+"px; float: left; position: absolute;'></div>");jQuery("#cs-"+el.id+i+j).css({'background-position':-sLeft+'px '+(-sTop+'px'),'left':sLeft,'top':sTop});sLeft+=sWidth;}
sTop+=sHeight;sLeft=0;}
jQuery('.cs-'+el.id).mouseover(function(){jQuery('#cs-navigation-'+el.id).show();});jQuery('.cs-'+el.id).mouseout(function(){jQuery('#cs-navigation-'+el.id).hide();});jQuery('#cs-title-'+el.id).mouseover(function(){jQuery('#cs-navigation-'+el.id).show();});jQuery('#cs-title-'+el.id).mouseout(function(){jQuery('#cs-navigation-'+el.id).hide();});if(params[el.id].hoverPause){jQuery('.cs-'+el.id).mouseover(function(){params[el.id].pause=true;});jQuery('.cs-'+el.id).mouseout(function(){params[el.id].pause=false;});jQuery('#cs-title-'+el.id).mouseover(function(){params[el.id].pause=true;});jQuery('#cs-title-'+el.id).mouseout(function(){params[el.id].pause=false;});}};jQuery.transitionCall=function(el){clearInterval(interval[el.id]);delay=params[el.id].delay+params[el.id].spw*params[el.id].sph*params[el.id].sDelay;interval[el.id]=setInterval(function(){jQuery.transition(el)},delay);}
jQuery.transition=function(el,direction){if(params[el.id].pause==true)return;jQuery.effect(el);squarePos[el.id]=0;appInterval[el.id]=setInterval(function(){jQuery.appereance(el,order[el.id][squarePos[el.id]])},params[el.id].sDelay);jQuery(el).css({'background-image':'url('+images[el.id][imagePos[el.id]]+')'});if(typeof(direction)=="undefined")
imagePos[el.id]++;else
if(direction=='prev')
imagePos[el.id]--;else
imagePos[el.id]=direction;if(imagePos[el.id]==images[el.id].length){imagePos[el.id]=0;}
if(imagePos[el.id]==-1){imagePos[el.id]=images[el.id].length-1;}
jQuery('.cs-button-'+el.id).removeClass('cs-active');jQuery('#cs-button-'+el.id+"-"+(imagePos[el.id]+1)).addClass('cs-active');if(titles[el.id][imagePos[el.id]]){jQuery('#cs-title-'+el.id).css({'opacity':0}).animate({'opacity':params[el.id].opacity},params[el.id].titleSpeed);jQuery('#cs-title-'+el.id).html(titles[el.id][imagePos[el.id]]);}else{jQuery('#cs-title-'+el.id).css('opacity',0);}};jQuery.appereance=function(el,sid){jQuery('.cs-'+el.id).attr('href',links[el.id][imagePos[el.id]]).attr('target',linksTarget[el.id][imagePos[el.id]]);if(squarePos[el.id]==params[el.id].spw*params[el.id].sph){clearInterval(appInterval[el.id]);return;}
jQuery('#cs-'+el.id+sid).css({opacity:0,'background-image':'url('+images[el.id][imagePos[el.id]]+')'});jQuery('#cs-'+el.id+sid).animate({opacity:1},300);squarePos[el.id]++;};jQuery.setNavigation=function(el){jQuery(el).append("<div id='cs-navigation-"+el.id+"'></div>");jQuery('#cs-navigation-'+el.id).hide();jQuery('#cs-navigation-'+el.id).append("<a href='#' id='cs-prev-"+el.id+"' class='cs-prev'>prev</a>");jQuery('#cs-navigation-'+el.id).append("<a href='#' id='cs-next-"+el.id+"' class='cs-next'>next</a>");jQuery('#cs-prev-'+el.id).css({'position':'absolute','top':params[el.id].height/2-15,'left':0,'z-index':1001,'line-height':'30px','opacity':params[el.id].opacity}).click(function(e){e.preventDefault();jQuery.transition(el,'prev');jQuery.transitionCall(el);}).mouseover(function(){jQuery('#cs-navigation-'+el.id).show()});jQuery('#cs-next-'+el.id).css({'position':'absolute','top':params[el.id].height/2-15,'right':0,'z-index':1001,'line-height':'30px','opacity':params[el.id].opacity}).click(function(e){e.preventDefault();jQuery.transition(el);jQuery.transitionCall(el);}).mouseover(function(){jQuery('#cs-navigation-'+el.id).show()});jQuery("<div id='cs-buttons-"+el.id+"' class='cs-buttons'></div>").appendTo(jQuery('#coin-slider-'+el.id));for(k=1;k<images[el.id].length+1;k++){jQuery('#cs-buttons-'+el.id).append("<a href='#' class='cs-button-"+el.id+"' id='cs-button-"+el.id+"-"+k+"'>"+k+"</a>");}
jQuery.each(jQuery('.cs-button-'+el.id),function(i,item){jQuery(item).click(function(e){jQuery('.cs-button-'+el.id).removeClass('cs-active');jQuery(this).addClass('cs-active');e.preventDefault();jQuery.transition(el,i);jQuery.transitionCall(el);})});jQuery('#cs-navigation-'+el.id+' a').mouseout(function(){jQuery('#cs-navigation-'+el.id).hide();params[el.id].pause=false;});jQuery("#cs-buttons-"+el.id).css({'left':'50%','margin-left':-images[el.id].length*15/2-5,'position':'relative'});}
jQuery.effect=function(el){effA=['random','swirl','rain','straight'];if(params[el.id].effect=='')
eff=effA[Math.floor(Math.random()*(effA.length))];else
eff=params[el.id].effect;order[el.id]=new Array();if(eff=='random'){counter=0;for(i=1;i<=params[el.id].sph;i++){for(j=1;j<=params[el.id].spw;j++){order[el.id][counter]=i+''+j;counter++;}}
jQuery.random(order[el.id]);}
if(eff=='rain'){jQuery.rain(el);}
if(eff=='swirl')
jQuery.swirl(el);if(eff=='straight')
jQuery.straight(el);reverse[el.id]*=-1;if(reverse[el.id]>0){order[el.id].reverse();}}
jQuery.random=function(arr){var i=arr.length;if(i==0)return false;while(--i){var j=Math.floor(Math.random()*(i+1));var tempi=arr[i];var tempj=arr[j];arr[i]=tempj;arr[j]=tempi;}}
jQuery.swirl=function(el){var n=params[el.id].sph;var m=params[el.id].spw;var x=1;var y=1;var going=0;var num=0;var c=0;var dowhile=true;while(dowhile){num=(going==0||going==2)?m:n;for(i=1;i<=num;i++){order[el.id][c]=x+''+y;c++;if(i!=num){switch(going){case 0:y++;break;case 1:x++;break;case 2:y--;break;case 3:x--;break;}}}
going=(going+1)%4;switch(going){case 0:m--;y++;break;case 1:n--;x++;break;case 2:m--;y--;break;case 3:n--;x--;break;}
check=jQuery.max(n,m)-jQuery.min(n,m);if(m<=check&&n<=check)
dowhile=false;}}
jQuery.rain=function(el){var n=params[el.id].sph;var m=params[el.id].spw;var c=0;var to=to2=from=1;var dowhile=true;while(dowhile){for(i=from;i<=to;i++){order[el.id][c]=i+''+parseInt(to2-i+1);c++;}
to2++;if(to<n&&to2<m&&n<m){to++;}
if(to<n&&n>=m){to++;}
if(to2>m){from++;}
if(from>to)dowhile=false;}}
jQuery.straight=function(el){counter=0;for(i=1;i<=params[el.id].sph;i++){for(j=1;j<=params[el.id].spw;j++){order[el.id][counter]=i+''+j;counter++;}}}
jQuery.min=function(n,m){if(n>m)return m;else return n;}
jQuery.max=function(n,m){if(n<m)return m;else return n;}
this.each(function(){init(this);});};jQuery.fn.coinslider.defaults={width:565,height:290,spw:7,sph:5,delay:3000,sDelay:30,opacity:0.7,titleSpeed:500,effect:'',navigation:true,links:true,hoverPause:true};})(jQuery);
jQuery(document).ready(function() {
jQuery('#games').coinslider({ hoverPause: true, delay: 5000 });
});
</script>
![Surprised](https://2img.net/i/fa/i/smiles/icon_surprised.gif)
NB:- lo script non funziona se non implementi nella pagina le librerie jQuery, ma sono già incluse nel forum, quindi non ce ne è bisogno, ma se ce ne fosse bisogno, aggiungi prima dello script questo codice:
- Codice:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
se hai bisogno di altro chiedi pure..
![happy](/users/3112/53/90/27/smiles/2632293392.gif)
EDIT:- la soluzione dell'iframe è molto allettante, di conseguenza ti basta usare questo codice:
- Codice:
<iframe src="http://mydashboard.altervista.org/slide/demo.html" scrolling="no" frameborder="0" style="height: 200px; width: 300px;"></iframe>
Re: Vari problemi
Grazie mille, uno cosa però non ho capito.
Lo script che mi hai modificato lo devo mettere nel CSS del forum?
EDIT: tramite iFrame mi viene così:![Vari problemi Scherm15](https://i.servimg.com/u/f47/16/07/03/89/scherm15.png)
Come posso togliere il bordo bianco sopra?
Lo script che mi hai modificato lo devo mettere nel CSS del forum?
EDIT: tramite iFrame mi viene così:
![Vari problemi Scherm15](https://i.servimg.com/u/f47/16/07/03/89/scherm15.png)
Come posso togliere il bordo bianco sopra?
Re: Vari problemi
o usi lo script che ti ho modificato (da mettere nel widget.. quello è un frullato inaudito di jquery, html e css.. se lo metti nel css ti va in pappa tutto..MaxPower97 ha scritto:Grazie mille, uno cosa però non ho capito.
Lo script che mi hai modificato lo devo mettere nel CSS del forum?
EDIT: tramite iFrame mi viene così:
Come posso togliere il bordo bianco sopra?
![Laughing](https://2img.net/i/fa/i/smiles/icon_lol.gif)
![Surprised](https://2img.net/i/fa/i/smiles/icon_surprised.gif)
per il bordo bianco devi modificare il css che hai caricato su altervista, ma non verrà mai perfetto considerando che ogni browser fa come cavolo gli pare..
![Surprised](https://2img.net/i/fa/i/smiles/icon_surprised.gif)
(ecco perchè gli iframe mi stanno altamente antipatici)
eppoi dai.. alla fine quel bordino bianco gli dona..
![Basketball](https://2img.net/i/fa/i/smiles/icon_basketball.gif)
![-](https://2img.net/i/empty.gif)
» cambio amministrazione forum
» PROBLEMI VARI
» Vari problemi con gli arrotondamenti!
» Vari problemi con il forum
» Problemi con templates vari
» PROBLEMI VARI
» Vari problemi con gli arrotondamenti!
» Vari problemi con il forum
» Problemi con templates vari
Forum dei Forum: Aiuto per Forumattivo :: Assistenza a problemi e richieste :: Problemi con uno script o codici :: I problemi risolti con i codici :: Argomenti chiusi con i codici
Pagina 1 di 1
Permessi in questa sezione del forum:
Non puoi rispondere agli argomenti in questo forum.