problema visualizzare elenco immagini

[maurissimo22]

Salve a tutti,
premesso che non sono esperto di javascript, e di qualunque altro linguaggio vario... però ci voglio provare.

Ho un problema nel visualizzare un elenco di immagini ( sto utilizzando un codice java preso da un altro sito, che vorrei adattare alle mie esigenze)

in praticha appena apro il sito,
l'elenco centrale delle immagini è vuoto,
ma se clicco sul link overview e lo richiudo, allora funziona tutto.

vi do i link dell'originale e quelli del mio esperimento

( non so se sia legale, ma non è a scopo commerciale, sto solo studiando sto benedetto codice )

original: www.pikaboo.be

mine: www.supermav.com/pikaboo

Se qualcuno potesse darmi l'mbeccata giusta glie ne sarei davvero grato.

[maurissimo22]

Guardando bene il codice js,
ho notato che loro richiamano uno script php,
quindi anche senza stare a modificare il loro script,
qualcuno conosce un tutorial per realizzare un elenco di immagini che scrolla come quello?

il mio vero obbiettivo è quello,
senza divisione per categorie o cose simili..


grazie ancora

[Xinod]

...
	showVideoDescription: function(id) {
		var description = $(id).getElements('.description')[0];
		description.setStyle('display','block');
...

la tua classe invece si chiama new_description

[maurissimo22]

Ok,
quindi per far vedere le immagini da subito e senza fare il passaggio su overview devo cambiare la dicitura description in new_description?

Questa è tutta la classe,
ma anche facendo questo ( ora infatti c'è new_description non i funziona

/*** FX CLASS ***/

pikaboo.fx = new Class({
showLogo: function() {
$$('h1')[0].setStyle('display','block');
var fx = new Fx.Morph($$('h1')[0], {duration:1000, transition:Fx.Transitions.Expo.easeOut});
fx.start({
/***'left': [-355, 15], ***/
'opacity': [0, 1]
});
},
hideLogo: function() {
var fx = new Fx.Morph($$('h1')[0], {duration:250, transition:Fx.Transitions.Expo.easeIn});
fx.start({
/***'left': [15, -355],***/
'opacity': [1, 0]
});
setTimeout('fx.completelyHideLogo()',250);
},
completelyHideLogo: function() {
$$('h1')[0].setStyle('display','none');
},
showMenuItem: function(param) {
$('menu').setStyle('display','block');
var fx = new Fx.Style($('menu_'+param), 'opacity', {duration: 500});
fx.start(0, 1);
},
hideMenu: function() {
var fx1 = new Fx.Style($('menu_news'), 'opacity', {duration: 500});
var fx2 = new Fx.Style($('menu_pics'), 'opacity', {duration: 500});
var fx3 = new Fx.Style($('menu_about'), 'opacity', {duration: 500});
var fx4 = new Fx.Style($('menu_contact'), 'opacity', {duration: 500});
fx1.start(1, 0);
fx2.start(1, 0);
fx3.start(1, 0);
fx4.start(1, 0);
setTimeout('fx.completelyHideMenu()',500);
},
completelyHideMenu: function() {
$('menu').setStyle('display','none');
},
showCategories: function() {
$('categories').setStyle('display','block');
var height = $$('#categories div')[0].getSize().y;
var fx = new Fx.Morph($('categories'), {duration:500, transition:Fx.Transitions.Expo.easeOut});
fx.start({
/***'bottom': [-height, 22],***/
'opacity': [0, 1]
});
},
hideCategories: function() {
var height = $$('#categories div')[0].getSize().y;
var fx = new Fx.Morph($('categories'), {duration:500, transition:Fx.Transitions.Expo.easeIn});
fx.start({
/***'bottom': [22, -height],***/
'opacity': [1, 0]
});
setTimeout('fx.completelyHideCategories()',500);
},
completelyHideCategories: function() {
$('categories').setStyle('display','none');
},
showScrollbar: function() {
$('scroll_top').setStyle('display','block');
$('scroll_bottom').setStyle('display','block');
var fx1 = new Fx.Style($('scroll_top'), 'opacity', {duration: 500});
var fx2 = new Fx.Style($('scroll_bottom'), 'opacity', {duration: 500});
fx1.start(0, 1);
fx2.start(0, 1);
},
hideScrollbar: function() {
var fx1 = new Fx.Style($('scroll_top'), 'opacity', {duration: 500});
var fx2 = new Fx.Style($('scroll_bottom'), 'opacity', {duration: 500});
fx1.start(1, 0);
fx2.start(1, 0);
setTimeout('fx.completelyHideScrollbar()',500);
},
completelyHideScrollbar: function() {
$('scroll_top').setStyle('display','none');
$('scroll_bottom').setStyle('display','none');
},
showVideo: function(id) {
var item = $(id);
var fx = new Fx.Style(item, 'opacity', {duration: 500});
fx.start(0, 1);
var next = item.getNext();
while (next && next.getStyle('display')==='none') {
next = next.getNext();
}
if (next) {
var id_next = next.getProperty('id');
setTimeout('fx.showVideo("'+id_next+'")',250);
}
},
showVideoBlock: function(id) {
var item = $(id);
item.setStyle('display','block');
var thumb = item.getElements('.thumbnail')[0].getFirst();
thumb.setProperty('rel',thumb.getProperty('rel').r eplace(/Hidden/,'Videos'));
},
hideVideoBlock: function(id) {
var item = $(id);
item.setStyles({display: 'none', opacity: '0'});
var thumb = item.getElements('.thumbnail')[0].getFirst();
thumb.setProperty('rel',thumb.getProperty('rel').r eplace(/Videos/,'Hidden'));
},
hideVideos: function() {
var item = $('videos');
var fx = new Fx.Style(item, 'opacity', {duration: 500});
fx.start(1, 0);
},
hideAllVideos: function() {
var videos = $$('#videos li');
videos.each(function(item) {
var fx = new Fx.Style(item, 'opacity', {duration: 500});
fx.start(1, 0);
});
},
showVideos: function() {
var item = $('videos');
var fx = new Fx.Style(item, 'opacity', {duration: 500});
fx.start(0, 1);
Shadowbox.reset(sb_options);
},
showVideoDescription: function(id) {
var description = $(id).getElements('.description')[0];
description.setStyle('display','block');
var fx = new Fx.Morph(description, {duration:500, transition:Fx.Transitions.Expo.easeOut});
fx.start({
'right': [0, -200],
'opacity': [0, 1]
});
},
showVideoTitle: function(id) {
var title = $(id).getElements('.title')[0];
title.setStyle('display','block');
var title_width = title.getSize().x;
var fx = new Fx.Morph(title, {duration:500, transition:Fx.Transitions.Expo.easeOut});
fx.start({
'right': [0, -title_width],
'opacity': [0, 1]
});
},
hideVideoDetails: function(id) {
$$('#'+id+' .description').setStyles({right: '0', opacity: '0'});
$$('#'+id+' .title').setStyles({right: '0', opacity: '0'});
},
reduceMenuItem: function(id) {
var fx = new Fx.Style($(id), 'height', {duration: 100});
fx.start(25, 20);
},
increaseMenuItem: function(id) {
var fx = new Fx.Style($(id), 'height', {duration: 150});
fx.start(20, 25);
},
categoryHighlight: function(id) {
var fx = new Fx.Style($(id), 'opacity', {duration: 250});
fx.start(0.65, 1);
},
categoryDefault: function(id) {
var fx = new Fx.Style($(id), 'opacity', {duration: 250});
fx.start(1, 0.65);
},
moveVideos: function() {
var ctop = parseInt($('videos').getStyle('top'));
var fx1 = new Fx.Style($('videos'), 'top', {duration: 500, transition:Fx.Transitions.Expo.easeOut});
fx1.start(ctop, -12);
var fx2 = new Fx.Morph($('videos_container'), {duration:500, transition:Fx.Transitions.Expo.easeOut});
fx2.start({
'left': [427, 8],
'width': [296, 896]
});
},
reposVideos: function() {
var videos = $$('#videos li');
var top = 0;
var left = 0;
var ctop;
var compteur = 0;
for (var i=0; i<videos.length; i++) {
if (videos[i].getStyle('display') === 'block') {
videos[i].setStyle('position','absolute');
videos[i].setStyle('z-index',500-compteur);
ctop = compteur*171;
if (compteur !== 0 && compteur%3 === 0) {
top += 171;
left = 0;
}
var fx = new Fx.Morph(videos[i], {duration:750, transition:Fx.Transitions.Expo.easeOut});
fx.start({
'top': [ctop, top],
'left': [0, left]
});
left += 300;
compteur++;
}
}
setTimeout('fx.showBrowserScrollbar()',750);
},
resetVideos: function() {
$('videos_container').setStyles({
/***left: '427px',
width: '496px'***/
});
$$('#videos li').each(function(item) {
item.setStyles({
position: 'relative',
top: 'auto',
left: 'auto',
zIndex: 'auto'
});
});
fx.hideBrowserScrollbar();

},
showBrowserScrollbar: function() {
$('videos_container').setStyles({overflow:'visible ', height:'auto'});
$$('html')[0].setStyle('overflow-y','visible');
$$('body')[0].setStyle('overflow-y','visible');
},
hideBrowserScrollbar: function() {
$('videos_container').setStyle('overflow','hidden' );
$$('html')[0].setStyle('overflow','hidden');
$$('body')[0].setStyle('overflow','hidden');
},
showCloseOverview: function() {
var nb = video.nbVideos();
var left;
switch (nb) {
case 1 : left = 304; break;
case 2 : left = 604; break;
default : left = 904; break;
}
$('close_overview').setStyle('left', left+'px');
var fx = new Fx.Style($('close_overview'), 'opacity', {duration: 500});
fx.start(0, 1);
},
hideCloseOverview: function() {
var fx = new Fx.Style($('close_overview'), 'opacity', {duration: 500});
fx.start(1, 0);
},
upVideos: function() {
var fx = new Fx.Style($('videos'), 'top', {duration: 500});
fx.start(0, -12);
},
downVideos: function() {
var fx = new Fx.Style($('videos'), 'top', {duration: 500});
fx.start(-12, 0);
}
});

[Xinod]

quello era un errore che facevi
di girarmi tutto quel codice per vedere dove altro hai sbagliato copiando non ho proprio tempo
ciao

[maurissimo22]

non intendevo fartelo correggere,
volevo solo capire se l'errore è nel codice js nel html o nel css