PDA

Visualizza la versione completa : jquery, scriptaculous chi pių ne ha pių ne metta


mejode
18-02-2009, 10:12
Ciao a tutti, sono un paio di giorni che ci batto la testa e non ne vengo fuori.
Vi spiego la cosa...
ho una pagina un po' particolare...

c'č un menų a tendina che si puo' spostare con un drag n' drop,
c'č un box che appare e scompare con un clik
c'č una gallery con le foto che scorrono cliccando su delle frecce
c'č un ingrandimento delle foto fatto con lightbox

e fin qua sembrerebbe tutto ok se non fosse che

se inserisco lo slider delle foto non va pių il box che appare e scompare
e se inserisco sempre lo slider non va neppure il light box...

Incollo qui sotto il codice, se qualcuno ha qualche idea...



<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>DR&B struttura</title>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<link rel="stylesheet" type="text/css" href="css/stile.css" media="screen" />
<link rel="stylesheet" type="text/css" href="menuverticale/dhtml-vert.css" media="screen" />
<!--[if gte IE 5.5]>
<script language="JavaScript" src="menuverticalr/dhtml.js" type="text/JavaScript"></script>
<![endif]-->




<script src="javascript/prototype.js" type="text/javascript"></script>
<script src="javascript/scriptaculous.js" type="text/javascript"></script>
<script src="js/scriptaculous.js?load=effects,builder" type="text/javascript"></script>
<script src="js/lightbox.js" type="text/javascript"></script>
<script language="javascript" src="javascript/dom-drag.js"></script>
<script type="text/javascript" src="js/jsScroller.js"></script>
<script type="text/javascript" src="js/jsScrollbar.js"></script>
<script type="text/javascript" src="js/vari.js"></script>
<script src="Scripts/swfobject_modified.js" type="text/javascript"></script>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/easySlider.packed.js"></script>


<script type="text/javascript">
$(document).ready(function(){
$("#slider").easySlider({
orientation:'orizzontal'
});
});
</script>


<style type="text/css">
#root {
position:absolute;
z-index:100;
width:200px;
background-repeat: repeat-y;
background-position: center top;
}

#handle {
margin:0px;
padding:2px;
width:200px;
margin: auto;
color:#cc0000;
background-color:white;
font-family:verdana, sans-serif;
font-size:10px;
margin-top: -40px;
}



#slider ul, #slider li{
margin:0;
padding:0;
list-style:none;
}
#slider, #slider li{
/*
define width and height of container element and list item (slide)
list items must be the same size as the slider area
*/
width:885px;
height:500px;
overflow:hidden;
}
span#prevBtn{ position:absolute; left: 890px;top: 200px; color:#efefef;}
span#nextBtn{
position:absolute;
left: -70px;
top: 200px;
color:#efefef;



}

span#nextBtn a{display: block;width: 100px;
height: 100px; color: #efefef;background-image: url(images/next.gif);
background-repeat: no-repeat;}


span#prevBtn a{display: block;width: 100px;
height: 100px; color: #efefef;background-image: url(images/prev.gif);
background-repeat: no-repeat;}









</style>
</head>

<body>



<div style="position:absolute; top:0; right:0px;">
<ul>
Cambia lingua (#)
[/list]
</div>
<div style="position:absolute; top:0px; right:0px;">
<div id="slidedown_demo" style="display:none; width:100px; height:100px; background:#cc0000; text-align:center; margin: right;>
<div>X CHIUDI (#)

ITA (#) | ENG (#)</div>
</div>

</div>




<div id="generale">
<div id="containersito">



<div id="root">
<div id="handle">TRASCINA LA BARRA</div>
<div id="bloccomenu">
<div id="menu">
<ul id="navmenu">
Home (#)
Chi siamo + (#)
<ul>
Chi siamo (#)
Storia (#)
Struttura (#)
Sedi (#)
[/list]

[/list]
</div>
</div>
</div>

<script language="javascript">
var theHandle = document.getElementById("handle");
var theRoot = document.getElementById("root");
Drag.init(theHandle, theRoot);
</script>



<div id="titolo"><h1>TITOLO</h1></div>

<div id="txt">


<div id="slider">
<ul>
images/base.jpg (images/base.jpg)
images/02.jpg (#)
images/03.jpg (#)
images/04.jpg (#)
images/05.jpg (#)
[/list]
</div>



</div>




<div id="fotosotto">

<object id="FlashID" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="882" height="500">
<param name="movie" value="images/base.swf" />
<param name="quality" value="high" />
<param name="wmode" value="opaque" />
<param name="swfversion" value="6.0.65.0" />

<param name="expressinstall" value="Scripts/expressInstall.swf" />


<object type="application/x-shockwave-flash" data="images/base.swf" width="882" height="500">

<param name="quality" value="high" />
<param name="wmode" value="opaque" />
<param name="swfversion" value="6.0.65.0" />
<param name="expressinstall" value="Scripts/expressInstall.swf" />

<div>
<h4>Il contenuto di questa pagina richiede una nuova versione di Adobe Flash Player.</h4>


http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif (http://www.adobe.com/go/getflashplayer)</p>
</div>

</object>

</object>
</div>



</div>
</div>

<script type="text/javascript">
<!--
swfobject.registerObject("FlashID");
//-->
</script>
</body>
</html>

artorius
18-02-2009, 10:39
Tu lo sai vero che jQuery, PrototypeJs e Mootools sono incompatibili, perché usano gli stessi nomi per funzioni diverse?

mejode
18-02-2009, 10:45
ovviamente no :-)
ecco perchč non va pių niente :-)

artorius
18-02-2009, 10:47
Comunque, gli effetti tipo slider, Drag&Drop, lightbox, si trovano implementati con TUTTE le librerie, quindi devi solo scegliere una libreria e cercarti gli script che facciano gli effetti che desideri.

mejode
18-02-2009, 10:51
avevo iniziato a sospettare che non funzionassero insieme comunque...
ancora una decina di giorni e ci sarei arrivato da solo :-D
grazie comunque

Loading