 | |
| Voir le sujet précédent :: Voir le sujet suivant |
| Auteur |
Message |
meo
html mioche
 |
 carrousel , Posté le: 08-11-2006 21:11 |
|
|
Bonjour !
Ca fait un petit moment que je cherche, donc je viens quémander ...
J'aurais besoin d'une visionneuse type de celle qui est présente sur les blog photos de msn : une visionneuse principale et une autre sous forme de négatif/diapositive qui peut défiler à droite ou à gauche.
vous savez où trouver ? |
|
|
drac
html mioche
 |
| carrousel , Posté le: 09-11-2006 14:20 |
|
|
bonjour,
Cela va dépendre de ton hébergement, si celui-ci accepte les script PHP et les bases bases de données mysql alors tu trouvera plein de script d'album photo sur : http://www.phpscripts-fr.net/
Si ton hébergement web n'accepte que le html alors tu peux te donner de ADOBE PHOTO ALBUM qui te générera directement ton album phto ( tu devra le regénérer à chaque mise à jour )
Sinon il te reste la possibilité de prendre un abonnement chez un prestataire fournissant un album photo tout fait ( pas de developpement, juste de la configuration à faire ) tu trouvera un comaratif ici :
http://www.linternaute.com/guides/categorie/101/albums_photo_en_ligne.html
Voila en espérant avoir répondu a ta question
bon courage |
|
|
meo
html mioche
|
| carrousel , Posté le: 09-11-2006 18:45 |
|
|
Bonjour,
J'ai fait un tour sur les liens ... j'avoue que je débute encore et le php je connais pas trop ... et je n'ai pas trouvé de diaporama intéressant.
Par contre, j'ai trouvé ca :
| Code: |
<html>
<head>
<style>
a {
font-family: Arial;
font-size: 12pt;
color: #FFFFFF;
text-decoration: none;
}
a:hover { color: #CC0000; text-decoration: none; }
</style>
<script type='text/javascript'>
function carousel(params){
if(!(params.width>0&&isFinite(params.width)))params.width=100;
if(!(params.height>0&&isFinite(params.height)))params.height=100;
if(!(params.sides>2&&isFinite(params.sides)))params.sides=4;
if(!(params.steps>0&¶ms.steps<100&&isFinite(params.steps)))params.steps=20;
if(!(params.speed>0&&isFinite(params.speed)))params.speed=8;
if(!(params.image_border_width>=0&&isFinite(params.image_border_width)))params.image_border_width=0;
if(isFinite(params.id)||!params.id)params.id='bad_id_given_'+Math.random();
document.write("<div style='position:relative;overflow:hidden;' id='"+params.id.replace(/[\r\n\t ]+/g,'_')+"'></div>");
var cdiv=document.getElementById(params.id.replace(/[\r\n\t ]+/g,'_'))
cdiv.style.width=params.width+'px';
cdiv.style.height=params.height+'px';
cdiv.style.border=params.border;
cdiv.style.position='relative';
cdiv.style.overflow='hidden';
cdiv.title=params.id;
var counter=0,spinning=true,interval=Math.floor(60000/params.sides/params.steps/params.speed)-5;
interval=isNaN(interval)?200:interval;
var img_position=[],images=[],img_dimension=[];
var img_index=params.images.length+1,img_index_cap=2*params.images.length;
var faces=Math.ceil(params.sides/2), dimension, direction;
function init(){
if(params.direction=="left" || params.direction=="right"){
direction=params.direction;
dimension="width";
}
else if(params.direction=="top" || params.direction=="bottom"){
direction=params.direction;
dimension="height";
}
else {
direction="left";
dimension="width";
}
cdiv.style[dimension]=params[dimension]/(params.size_mode=='image'?Math.sin(Math.PI/params.sides):1)+'px';
var img=new Image();
img.style.position='absolute';
img.style[direction]='10000px';
img.style.width=params.width-2*params.image_border_width+'px';
img.style.height=params.height-2*params.image_border_width+'px';
img.style.border=(params.image_border_width||0)+'px solid '+params.image_border_color;
for(var i=0;i<params.images.length;i++){
images[i]=img.cloneNode(true);
images[i].src=params.images[i];
if(params.links&¶ms.links[i]&¶ms.links[i]!=''){
images[i].onclick=new Function("window.location='"+params.links[i]+"'");
images[i].style.cursor=document.all?'hand':'pointer';
}
if(params.titles&¶ms.titles[i]&¶ms.titles[i]!='')
images[i].title=params.titles[i];
images[i+params.images.length]=images[i];
if(params.images.length==faces)
images[i+2*params.images.length]=images[i];
cdiv.appendChild(images[i]);
}
var face_size=params.size_mode=='image'?params[dimension]:params[dimension]*Math.sin(Math.PI/params.sides);
var face_offset=params[dimension]*Math.cos(Math.PI/params.sides)/(params.size_mode=='image'?Math.sin(Math.PI/params.sides):1)/2-.5;
var pi_piece=2*Math.PI/params.steps/params.sides;
for(i=0;i<=params.steps*faces;i++){
img_dimension[i]=face_size*Math.sin(pi_piece*i);
img_position[i]=(i<params.steps*params.sides/2)?Math.floor(params[dimension]/2/(params.size_mode=='image'?Math.sin(Math.PI/params.sides):1)-face_offset*Math.cos(pi_piece*i)-img_dimension[i]/2)+'px':'10000px';
img_dimension[i]=img_dimension[i]-2*params.image_border_width>1?Math.ceil(img_dimension[i])-2*params.image_border_width+'px':'1px';
}
}
init();
cdiv.rotate = function(){
setTimeout('document.getElementById("'+cdiv.id+'").rotate()',interval);
if(!spinning) return;
if(++counter>=params.steps){
counter=0;
if(++img_index>=img_index_cap)
img_index=params.images.length;
}
images[img_index-faces].style[direction]='20000px';
for(var i=faces-1;i>=0;i--){
images[img_index-i].style[direction]=img_position[counter+i*params.steps];
images[img_index-i].style[dimension]=img_dimension[counter+i*params.steps];
}
}
cdiv.onmouseover=function(){
spinning=false;
}
cdiv.onmouseout=function(){
spinning=true;
}
setTimeout('document.getElementById("'+cdiv.id+'").rotate()',200);
}
</script>
</head>
<body bgcolor = "#00000000">
<div id="layer1">
<table width="800" border="0" cellspacing="2" cellpadding="0">
<tr>
<td>
<div align="center">
<font face="Arial" size="-1" color="#000099"><BR>
<table width="600" border="1" cellspacing="2" cellpadding="0" height="400">
<tr>
<td>
<div align="center">
</div>
</td>
</tr>
</table>
<BR>
</font>
<CENTER>
</CENTER>
<table width="180" border="1" cellspacing="2" cellpadding="0">
<tr>
<td>
<script type='text/javascript'>
carousel({id:'carousel_7',
border:'',
size_mode:'carousel',
width:287,
height:35,
sides:24,
steps:5,
speed:2,
direction:'right',
images:['http://www.codingforums.com/images/icons/icon8.gif',
'http://www.codingforums.com/images/icons/icon8.gif',
'http://www.codingforums.com/images/icons/icon3.gif',
'http://www.codingforums.com/images/icons/icon4.gif',
'http://www.codingforums.com/images/icons/icon5.gif',
'http://www.codingforums.com/images/icons/icon9.gif',
'http://www.codingforums.com/images/icons/icon10.gif',
'http://www.codingforums.com/images/icons/icon13.gif',
'http://www.codingforums.com/images/icons/icon12.gif',
'http://www.codingforums.com/images/icons/icon11.gif',
'http://www.codingforums.com/images/icons/icon2.gif',
'http://www.codingforums.com/images/icons/icon6.gif'],
links: ['http://www.codingforums.com/',
'http://www.codingforums.com/',
'http://www.codingforums.com/',
'http://www.codingforums.com/'],
titles:[],
image_border_width:1,
image_border_color:'black'
});
</script>
</td>
</tr>
</table>
<br>
</div>
</td>
</tr>
<tr>
<td>
<div align="center">
</div>
</td>
</tr>
</table>
</div>
</body>
</html>
|
Le carrousel est pas top top encore mais je souhaiterais pouvoir faire un lien du carrousel au cadre central pour chaque photo ... je n'y arrive pas 
J'ai trouvé une autre source qui me convient mieux mais je ne comprends pas non plus l'intallation ... (c'est en anglais) ?
http://billwscott.com/carousel/carousel_dhtml_load.html [http://billwscott.com/carousel/carousel_dhtml_load.html]
Merci d'avance  |
|
|
drac
html mioche
|
| carrousel , Posté le: 09-11-2006 19:36 |
|
|
oui , sympa en effet.
Le 2eme exemple est basé sur le framework de yahoo.
En fait, tu as des sources qui ne sont pas exploitable tel quelle.
Elle sont la pour montrer les possibilités des frameworks ainsi que de AJAX.
Tu devrais plutôt t'orienter vers des script tout fait. |
|
|
meo
html mioche
|
| carrousel , Posté le: 09-11-2006 20:06 |
|
|
merci !
C'est effectivement ce que je fais, du coup 
Par contre, il me manque toujours le code (qui doit être tou bête ) pour faire mon lien dans mon cadre central ... Tu sais comment faire  |
|
|
|
|
 S'enregistrer
 Profil
 Se connecter pour vérifier ses messages privés
 Rechercher
 Membres
 FAQ
 Connexion
|
