Nicht mehr ganz neu hier
Hallo,
habe es nun endlich geschafft und meine Seite einigermaßen auf Yaml umgesetzt. Leider habe ich hier noch 2 kleine Probleme bei denen ich hoffe, dass mir die Community hier helfen kann.
Zum einen möchte ich oben im Header ein Logo drin haben, aber ich bekomme den CSS-Teil nicht hin damit sich das Bild nicht rechts wiederholt und eine feste Höhe sollte auch sein.
Das weitere Problem ist, dass ich im linken DIV gerne das Foldout von Javarea.de drin haben möchte, weiss aber nicht was ich in welche Datei schreiben muss...
Könnte mir da evtl. jemand behilflich sein?
Hier mal der Teil aus der basemod.css
Und hier das Naviscript welches in col1 stehen soll
Für Unterstützung bzw Lösungen bin ich sehr dankbar! Gerne kann ich alles auch per FTP bereitstellen....einfach eine private Nachricht senden.
Danke im Voraus
habe es nun endlich geschafft und meine Seite einigermaßen auf Yaml umgesetzt. Leider habe ich hier noch 2 kleine Probleme bei denen ich hoffe, dass mir die Community hier helfen kann.
Zum einen möchte ich oben im Header ein Logo drin haben, aber ich bekomme den CSS-Teil nicht hin damit sich das Bild nicht rechts wiederholt und eine feste Höhe sollte auch sein.
Das weitere Problem ist, dass ich im linken DIV gerne das Foldout von Javarea.de drin haben möchte, weiss aber nicht was ich in welche Datei schreiben muss...
Könnte mir da evtl. jemand behilflich sein?
Hier mal der Teil aus der basemod.css
Code:
/**
* "Yet Another Multicolumn Layout" - (X)HTML/CSS framework
* (en) stylesheet for screen layout
* (de) Stylesheet für das Bildschirm-Layout
*
* @creator YAML Builder V1.2.1 ([URL="http://builder.yaml.de"]YAML Builder | A tool for visual development of YAML based CSS layouts[/URL])
* @file basemod.css
* @-yaml-minver 3.3
*/
@media screen, projection
{
/**
* (en) Forcing vertical scrollbars in IE8, Firefox, Webkit & Opera
* (de) Erzwingen vertikaler Scrollbalken in IE8, Firefox, Webkit & Opera
*
* @workaround
* @affected IE8, FF, Webkit, Opera
* @css-for all
* @valid CSS3
*/
body { overflow-y: scroll; }
/*-------------------------------------------------------------------------*/
/* (en) Marginal areas & page background */
/* (de) Randbereiche & Seitenhintergrund */
body { background: #000504 none; padding: 10px 0; }
/* Layout Alignment | Layout-Ausrichtung */
.page_margins { margin: 0 auto; }
/* Layout Properties | Layout-Eigenschaften */
.page_margins { width: auto; min-width: 740px; max-width: 90em; background: #fff; }
.page { padding: 10px 15px 10px 10px; }
#header { position:relative; padding: 45px 2em 1em 20px; color: #000; background: #fff; }
#topnav { position:absolute; top:10px; right:10px; text-align:right; color: #aaa; background: transparent; }
#nav { overflow:hidden; }
#main { margin: 10px 0; background: #fff; }
#footer { padding: 10px 20px; color:#666; background: #f9f9f9; border-top: 5px #efefef solid; }
/* (en) navigation: horizontal adjustment | (de) horizontale Ausrichtung */
#nav ul { margin-left: 20px; }
/*-------------------------------------------------------------------------*/
/**
* (en) Formatting content container
* (de) Formatierung der Inhalts-ContainerUnd hier das Naviscript welches in col1 stehen soll
Code:
<body onload="init()">
<table border="0" cellpadding="4" cellspacing="3" width="100%">
<tr>
<td align="left" width="20%">
<style>
DIV.clTop {position:absolute; width:170}
DIV.clSub {position:absolute; left:15; width:170;}
#divCont {position:relative; left:100; height:100; width:170;}
A.clMain {font-family:Arial, Verdana, Helvetica, Helv; font-size:14px; text-decoration:none; font-weight:bold; color:black;}
A.clSubb {font-family:Arial, Verdana, Helvetica, Helv; font-size:14px; text-decoration:none; color:black;}
#divMain {position:absolute;}
</style>
<script language="JavaScript">
<!--
var stayFolded=false
var exImg=new Image(); exImg.src='dsmh.gif'
var unImg=new Image(); unImg.src='usm.gif'
var n = (document.layers) ? 1:0;
var ie = (document.all) ? 1:0;
var browser=((n || ie) && parseInt(navigator.appVersion)>=4)
function makeMenu(obj,nest){
nest=(!nest) ? '':'document.'+nest+'.'
this.css=(n) ? eval(nest+'document.'+obj):eval('document.all.'+obj+'.style')
this.ref=(n) ? eval(nest+'document.'+obj+'.document'):eval('document');
this.height=n?this.ref.height:eval(obj+'.offsetHeight')
this.x=(n)? this.css.left:this.css.pixelLeft;this.y=(n)? this.css.top:this.css.pixelTop;
this.hideIt=b_hideIt; this.showIt=b_showIt; this.vis=b_vis; this.moveIt=b_moveIt
return this
}
function b_showIt(){this.css.visibility="visible"}
function b_hideIt(){this.css.visibility="hidden"}
function b_vis(){if(this.css.visibility=="hidden" || this.css.visibility=="hide") return true;}
function b_moveIt(x,y){this.x=x; this.y=y; this.css.left=this.x; this.css.top=this.y}
function init(){
oTop=new Array()
oTop[0]=new makeMenu('divTop1','divCont')
oTop[1]=new makeMenu('divTop2','divCont')
oTop[2]=new makeMenu('divTop3','divCont')
oTop[3]=new makeMenu('divTop4','divCont')
oTop[4]=new makeMenu('divTop5','divCont')
oTop[5]=new makeMenu('divTop6','divCont')
oSub=new Array()
oSub[0]=new makeMenu('divSub1','divCont.document.divTop1')
oSub[1]=new makeMenu('divSub2','divCont.document.divTop2')
oSub[2]=new makeMenu('divSub3','divCont.document.divTop3')
oSub[3]=new makeMenu('divSub4','divCont.document.divTop4')
oSub[4]=new makeMenu('divSub5','divCont.document.divTop5')
oSub[5]=new makeMenu('divSub6','divCont.document.divTop6')
for(i=0;i<oSub.length;i++){ oSub[i].hideIt() }
for(i=1;i<oTop.length;i++){ oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height) }
}
function menu(num){
if(browser){
if(!stayFolded){
for(i=0;i<oSub.length;i++){
if(i!=num){
oSub[i].hideIt()
oTop[i].ref["imgA"+i].src=unImg.src
}
}
for(i=1;i<oTop.length;i++){
oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height)
}
}
if(oSub[num].vis()){
oSub[num].showIt()
oTop[num].ref["imgA"+num].src=exImg.src
}else{
oSub[num].hideIt()
oTop[num].ref["imgA"+num].src=unImg.src
}
for(i=1;i<oTop.length;i++){
if(!oSub[i-1].vis()) oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height+oSub[i-1].height)
else oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height)
}
}
}
// -->
</script>
<div id="divCont">
<div id="divTop1" class="clTop"><a href="#" target="_self" onclick="menu(0); return false" class="clMain">
<img src="usm.gif" name="imgA0" alt="" border="0"> Auswahl 1</a><br>
<div id="divSub1" class="clSub">
<a href="#" target="_self" class="clSubb">Punkt 1a</a><br>
<a href="#" target="_self" class="clSubb">Punkt 1b</a><br>
</div>
</div>
<div id="divTop2" class="clTop"><a href="#" target="_self" onclick="menu(1); return false" class="clMain">
<img src="usm.gif" name="imgA1" alt="" border="0"> Auswahl 2</a><br>
<div id="divSub2" class="clSub">
<a href="#" target="_self" class="clSubb">Punkt 2a</a><br>
<a href="#" target="_self" class="clSubb">Punkt 2b</a><br>
</div>
</div>
<div id="divTop3" class="clTop"><a href="#" target="_self" onclick="menu(2); return false" class="clMain">
<img src="usm.gif" name="imgA2" alt="" border="0"> Auswahl 3</a><br>
<div id="divSub3" class="clSub">
<a href="#" target="_self" class="clSubb">Punkt 3a</a><br>
<a href="#" target="_self" class="clSubb">Punkt 3b</a><br>
</div>
</div>
<div id="divTop4" class="clTop"><a href="" onclick="menu(3); return false" class="clMain">
<img src="usm.gif" name="imgA3" alt="" border="0"> Auswahl 4</a><br>
<div id="divSub4" class="clSub">
<a href="#" target="_self" class="clSubb">Punkt 4a</a><br>
<a href="#" target="_self" class="clSubb">Punkt 4b</a><br>
</div>
</div>
<div id="divTop5" class="clTop"><a href="" onclick="menu(4); return false" class="clMain">
<img src="usm.gif" name="imgA4" alt="" border="0"> Auswahl 5</a><br>
<div id="divSub5" class="clSub">
<a href="#" target="_self" class="clSubb">Punkt 5a</a><br>
<a href="#" target="_self" class="clSubb">Punkt 5b</a><br>
</div>
</div>
<div id="divTop6" class="clTop"><a href="" onclick="menu(5); return false" class="clMain">
<img src="usm.gif" name="imgA5" alt="" border="0"> Auswahl 6</a><br>
<div id="divSub6" class="clSub">
<a href="#" target="_self" class="clSubb">Punkt 6a</a><br>
<a href="#" target="_self" class="clSubb">Punkt 6b</a><br>
</div>
</div>
</div>
</td>
</tr>
</table>Für Unterstützung bzw Lösungen bin ich sehr dankbar! Gerne kann ich alles auch per FTP bereitstellen....einfach eine private Nachricht senden.
Danke im Voraus
