Hallo Leute,
ich bin ein absoluter Newbie in Sachen WCMS, aber da ich den eindruck habe, dass ich mit diesem CMS am besten zurechtkommen werde habe ich es ausgesucht.
Ich habe vor eine Galleryseite zu erstellen, dh. Fotos und Partyberichte sollen als Inhalt dienen.
So jetzt habe ich mein design mehr oder weniger fertig und habe es auch bis zum header im HTML und JS umgesetzt. Das Problem ist jedoch die Navigation, denn ich verwende image rollover und würde diese auch gerne weiterhin verwenden, da ich am Aussehen der Navigation nichts verändern möchte(außer man kann eine solche Navigation in css oder php umsetzten und ihr helft mir dabei:D) .
Frage ist jezt also wie kann ich die Navigation mit den Rolloverimages in PHPWCMS umsetzten.
Ich habe es zwar geschaft, dass das normale image angezeigt wird aber ich kriege es nicht hin, dass beim Drüberfahren das rollover Bild angezeigt wird.
http://home.arcor.de/kda/bonnp/
Rollover Menü mit JS
Ich hab auch so ein menu in der Seite.
Das script ist seperat als datei und ich habe es i mitverlinkt. Das kommt in "html head" in die Vorlage.
Dann gibts da noch ein Feld "js on load". Da die bilder alle vorladen lassen, bspw:
Und dann noch das menu noch irgendwo in die Vorlage, z.B.
Das script ist seperat als datei und ich habe es i mit
Code: Select all
<script src="scripts/mainnavigation.js" language="javascript" type="text/javascript"></script>
Dann gibts da noch ein Feld "js on load". Da die bilder alle vorladen lassen, bspw:
Code: Select all
XM_initImages('01','picture/nav/navover_01.gif','picture/nav/navover_01.gif','nolinkstart','Home','picture/nav/navover_02.gif','picture/nav/navover_02.gif','homelink','St MaryMagdalene','picture/nav/navover_03.gif','picture/nav/navover_03.gif','St Mary Magdalene link','St David','picture/nav/navover_04.gif','picture/nav/navover_04.gif','St David link','Academy','picture/nav/navover_05.gif','picture/nav/navover_05.gif','Academy link','Refugee Centre','picture/nav/navover_06.gif','picture/nav/navover_06.gif','Refugee Centre link','Paradise Project','picture/nav/navover_07.gif','picture/nav/navover_07.gif','Paradise Project link','Anonymous','picture/nav/navover_08.gif','picture/nav/navover_08.gif','Anonymous link','**** Office','picture/nav/navover_09.gif','picture/nav/navover_09.gif','**** Office link','10','picture/nav/navover_10.gif','picture/nav/navover_10.gif','nolinkend')
Code: Select all
<tr>
<td><img name="01" src="picture/nav/nav_01.gif" width="8" height="22" border="0" alt="" /></td>
<td><a href="index.phtml" onmouseout="document.XM_img[1].restore();" onmouseover="document.XM_img[1].swap();" onclick="document.XM_img[1].stick();"><img name="Home" src="picture/nav/nav_02.gif" width="52" height="22" border="0" alt="Home" /></a></td>
<td><a href="index.php?mm" onmouseout="document.XM_img[2].restore();" onmouseover="document.XM_img[2].swap();" onclick="document.XM_img[2].stick();"><img name="St Mary Magdalene" src="picture/nav/nav_03.gif" width="107" height="22" border="0" alt="St Mary Magdalene" /></a></td>
usw.
Danke erst einmal das du so schnell geantwortet hast! Ich habe das gefühl, dass ich dem ganzen schon etwas näher gekommen bin aber mein Problem ist "mainnavigation.js". Wo bekomme ich die denn her?
Kann ich die "frontend.js" von phpWcms verwenden? Wenn ja muss ich doch nur noch die Pfade im Preloadcode an meine Bilder anpassen und die <img> links natürlich auch oder?
Kann ich die "frontend.js" von phpWcms verwenden? Wenn ja muss ich doch nur noch die Pfade im Preloadcode an meine Bilder anpassen und die <img> links natürlich auch oder?
Ach so, Also ich habe das Menu im Dreamweaver gebastelt und da geht
das halt so automatisch. Das Resultat ist dann, dass ein ganzer Batzen
Javascript im <head> erscheint. Diesen Script-Code habe ich dann
genommen und in diese externe Datei "mainnavigation.js" kopiert, damit
es in meinen Templates nicht zu unuebersichtlich wird. Wie man das von
Hand alles programmiert - keine Ahnung. Ich kann dir aber natuerlich
mein script hier mal hinkopieren. Ansonsten kann ich Dir da nicht mit
weiterhelfen. Da versteh ich naehmlich sonst auch nur Bahnhof.
das halt so automatisch. Das Resultat ist dann, dass ein ganzer Batzen
Javascript im <head> erscheint. Diesen Script-Code habe ich dann
genommen und in diese externe Datei "mainnavigation.js" kopiert, damit
es in meinen Templates nicht zu unuebersichtlich wird. Wie man das von
Hand alles programmiert - keine Ahnung. Ich kann dir aber natuerlich
mein script hier mal hinkopieren. Ansonsten kann ich Dir da nicht mit
weiterhelfen. Da versteh ich naehmlich sonst auch nur Bahnhof.
Code: Select all
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function XM_images(n,o,d,l) { //v1.0
this.obj=MM_findObj(n);this.n=n;this.u=this.obj.src;this.s=1;this.o=o;this.d=d;
this.swap=function() {if(this.s==1){this.obj.src=this.o;this.s=2}}
this.stick=function() {this.obj.src=this.d;this.s=3;XM_unStick(this.n)}
this.restore=function(){if(this.s==2){this.obj.src=this.u;this.s=1}}
if (document.location.href.indexOf(l)!=-1) this.stick()
}
function XM_unStick(n){ //v1.0
for (var i=0;i<document.XM_img.length;i++)if (document.XM_img[i].n!=n)
{document.XM_img[i].s=2;document.XM_img[i].restore()}
}
function XM_initImages() { //v1.0
var a=XM_initImages.arguments;document.XM_img=new Array();for(i=0;i<a.length;i=i+4){
document.XM_img[document.XM_img.length]=new XM_images(a[i],a[i+1],a[i+2],a[i+3])}
}