Hej.
Jeg er rendt på problemer med opbygningen af en hjemme siden.
Jeg skal kombinere en menubar, der skal hente et css dokument og 2 javascript dokumenter, med et billedgalleri der ligeledes skal hente sine funktioner fra et css og et java dokument.
Når jeg sætter begge ind på siden falder menubaren fra hinanden mens galleriet stadig virker.
De følgende koder er koder til siden hvor kune menuen er indsat samt et billed i venstre hjørne som virker ud fra samme .css og .js dokument:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Elevforeningen Eisbjerghus Efterskole</title>
<script type="text/javascript" src="menucode/jquery.js"></script>
<script type="text/javascript" src="menucode/interface.js"></script>
<link href="style.css" rel="stylesheet" type="text/css" />
<!--[if lt IE 7]>
<style type="text/css">
.dock img { behavior: url(iepngfix.htc) }
</style>
<![endif]-->
<style type="text/css">
body {background-color:#000000}
</style>
<style type="text/css">
img, div { behavior: url(iepngfix.htc) }
</style>
</head>
<body>
<center>
<!--top dock -->
<div class="dock" id="dock">
<div class="dock-container">
<a class="dock-item" href="#"><img src="images/blaa/hjem-blaa.png" alt="Hjem" /><span><font color="#ffffff">Hjem</font></span></a>
<a class="dock-item" href="kontakt.html"><img src="images/blaa/kontakt-blaa.png" alt="Kontakt" /><span><font color="#ffffff">Kontakt os</font></span></a>
<a class="dock-item" href="billedgalleri.html"><img src="images/blaa/billeder-blaa.png" alt="Billeder" /><span><font color="#ffffff">Billeder</font></span></a>
<a class="dock-item" href="nyheder.html"><img src="images/blaa/nyheder-blaa.png" alt="Nyheder" /><span><font color="#ffffff">Nyheder</font></span></a>
<a class="dock-item" href="menneskerne_bag.html"><img src="images/blaa/menneskerne-bag-blaa.png" alt="Menneskerne bag" /><span><font color="#ffffff">Menneskerne bag</font></span></a>
<a class="dock-item" href="om_elevforeningen.html"><img src="images/blaa/om-elevforeningen-blaa.png" alt="Om elevforeningen" /><span><font color="#ffffff">Om elevforeningen</font></span></a>
<a class="dock-item" href="formalia.html"><img src="images/blaa/formalia-blaa.png" alt="Formalia" /><span><font color="#ffffff">Formalia</font></span></a>
<a class="dock-item" href="event.html"><img src="images/blaa/event-blaa.png" alt="Event" /><span><font color="#ffffff">Event</font></span></a>
<a class="dock-item" href="nye-medlemmer.html"><img src="images/blaa/nye-medlemmer-blaa.png" alt="Nye medlemmer" /><span><font color="#ffffff">Nye medlemmer</font></span></a>
</div>
</div>
</center>
<div class="dock" id="dock2">
<div class="dock-container2">
<a class="dock-item2" href="nye-medlemmer.html"><img src="images/nye-medlemmer.png" alt="rss" /></a>
</div>
</div>
<!--dock menu JS options -->
<script type="text/javascript">
$(document).ready(
function()
{
$('#dock').Fisheye(
{
maxWidth: 80,
items: 'a',
itemsText: 'span',
container: '.dock-container',
itemWidth: 70,
proximity: 110,
halign : 'center'
}
)
$('#dock2').Fisheye(
{
maxWidth: 60,
items: 'a',
itemsText: 'span',
container: '.dock-container2',
itemWidth: 40,
proximity: 80,
alignment : 'left',
valign: 'bottom',
halign : 'left'
}
)
}
);
</script>
</body>
</html>
Koden virker fuldt ud efter dens hensigt men nåh jeg prøver at koble "lightbox" galleriet til på siden så fungere menuen ikke længere. Den klumper sammen i højre hjørne og alle funktioner er sat ud af spil.
Er der nogen der kan forklare mig enten hvordan jeg løser dette problem eller hvad grunden til det selv samme er?
Håber i kan hjælpe mig.
Om ikke andet fortælle mig og det skyldes at det simpelthen ikke er muligt at have to java-baseret objekter på samme side?
Her er koderne som de ser ud når jeg har tilføjet galleriet:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Elevforeningen Eisbjerghus Efterskole</title>
<script type="text/javascript" src="menucode/jquery.js"></script>
<script type="text/javascript" src="menucode/interface.js"></script>
<link href="style.css" rel="stylesheet" type="text/css" />
<!--[if lt IE 7]>
<style type="text/css">
.dock img { behavior: url(iepngfix.htc) }
</style>
<![endif]-->
<style type="text/css">
body {background-color:#000000}
</style>
<style type="text/css">
img, div { behavior: url(iepngfix.htc) }
</style>
<script src="js/prototype.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>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" /></head>
<body>
<center>
<!--top dock -->
<div class="dock" id="dock">
<div class="dock-container">
<a class="dock-item" href="#"><img src="images/blaa/hjem-blaa.png" alt="Hjem" /><span><font color="#ffffff">Hjem</font></span></a>
<a class="dock-item" href="kontakt.html"><img src="images/blaa/kontakt-blaa.png" alt="Kontakt" /><span><font color="#ffffff">Kontakt os</font></span></a>
<a class="dock-item" href="billedgalleri.html"><img src="images/blaa/billeder-blaa.png" alt="Billeder" /><span><font color="#ffffff">Billeder</font></span></a>
<a class="dock-item" href="nyheder.html"><img src="images/blaa/nyheder-blaa.png" alt="Nyheder" /><span><font color="#ffffff">Nyheder</font></span></a>
<a class="dock-item" href="menneskerne_bag.html"><img src="images/blaa/menneskerne-bag-blaa.png" alt="Menneskerne bag" /><span><font color="#ffffff">Menneskerne bag</font></span></a>
<a class="dock-item" href="om_elevforeningen.html"><img src="images/blaa/om-elevforeningen-blaa.png" alt="Om elevforeningen" /><span><font color="#ffffff">Om elevforeningen</font></span></a>
<a class="dock-item" href="formalia.html"><img src="images/blaa/formalia-blaa.png" alt="Formalia" /><span><font color="#ffffff">Formalia</font></span></a>
<a class="dock-item" href="event.html"><img src="images/blaa/event-blaa.png" alt="Event" /><span><font color="#ffffff">Event</font></span></a>
<a class="dock-item" href="nye-medlemmer.html"><img src="images/blaa/nye-medlemmer-blaa.png" alt="Nye medlemmer" /><span><font color="#ffffff">Nye medlemmer</font></span></a>
</div>
</div>
<a href="images/image-1.jpg" rel="lightbox"><img src="images/thumb-1.jpg" width="100" height="40" alt="" /></a> </center>
<div class="dock" id="dock2">
<div class="dock-container2">
<a class="dock-item2" href="nye-medlemmer.html"><img src="images/nye-medlemmer.png" alt="rss" /></a>
</div>
</div>
<!--dock menu JS options -->
<script type="text/javascript">
$(document).ready(
function()
{
$('#dock').Fisheye(
{
maxWidth: 80,
items: 'a',
itemsText: 'span',
container: '.dock-container',
itemWidth: 70,
proximity: 110,
halign : 'center'
}
)
$('#dock2').Fisheye(
{
maxWidth: 60,
items: 'a',
itemsText: 'span',
container: '.dock-container2',
itemWidth: 40,
proximity: 80,
alignment : 'left',
valign: 'bottom',
halign : 'left'
}
)
}
);
</script>
</body>
</html>