bombastiiclayout26

Home

und nach einer weile wieder ein layout

hoffe es gefällt euch

So sieht dein Text Fett Kursiv Unterstrichen ~~Durchstrichen~~ und als Link aus.

Das ist deine Ueberschrift

Der Code

Text über dem Design:

var fadeimages=new Array()
//Arrayerzeugung
fadeimages[0]=["http://www7.pic-upload.de/02.07.12/n2ipu47g4l8n.png", "", ""]
fadeimages[1]=["http://www7.pic-upload.de/02.07.12/8uuoqogrgta.png", "", ""]
fadeimages[2]=["http://www10.pic-upload.de/02.07.12/j9s9mdoe7g5s.png", "", ""]
fadeimages[3]=["http://www10.pic-upload.de/02.07.12/6xb9ss1qcwt.png", "", ""]
fadeimages[4]=["http://www10.pic-upload.de/02.07.12/dlwkeufmnjiu.png", "", ""]
fadeimages[5]=["http://www7.pic-upload.de/02.07.12/7hga3iqgklk.png", "", ""]
fadeimages[6]=["http://www10.pic-upload.de/02.07.12/ztpi32ve65si.png", "", ""]
fadeimages[7]=["http://www10.pic-upload.de/02.07.12/k74wedsdgtyl.png", "", ""]

var fadebgcolor="#000000"

var fadearray=new Array() //array to cache fadeshow instances
var fadeclear=new Array() //array to cache corresponding clearinterval pointers

var dom=(document.getElementById) //modern dom browsers
var iebrowser=document.all

function fadeshow(theimages, fadewidth, fadeheight, borderwidth, delay, pause, displayorder){
this.pausecheck=pause
this.mouseovercheck=0
this.delay=delay
this.degree=10 //initial opacity degree (10%)
this.curimageindex=0
this.nextimageindex=1
fadearray[fadearray.length]=this
this.slideshowid=fadearray.length-1
this.canvasbase="canvas"+this.slideshowid
this.curcanvas=this.canvasbase+"_0"
if (typeof displayorder!="undefined")
theimages.sort(function() {return 0.5 - Math.random();}) //thanks to Mike (aka Mwinter) <img src="http://theme.webme.com/smiles/smiley.gif" border="0">
this.theimages=theimages
this.imageborder=parseInt(borderwidth)
this.postimages=new Array() //preload images
for (p=0;p<theimages.length;p++){
this.postimages[p]=new Image()
this.postimages[p].src=theimages[p][0]
}

var fadewidth=fadewidth+this.imageborder*2
var fadeheight=fadeheight+this.imageborder*2

if (iebrowser&&dom||dom) //if IE5+ or modern browsers (ie: Firefox)
document.write('<div id="master'+this.slideshowid+'" style="position:relative;width:'+fadewidth+'px;height:'+fadeheight+'px;overflow:hidden;"><div id="'+this.canvasbase+'_0" style="position:absolute;width:'+fadewidth+'px;height:'+fadeheight+'px;top:0;left:0;filter:progid:DXImageTransform.Microsoft.alpha(opacity=10);opacity:0.1;-moz-opacity:0.1;-khtml-opacity:0.1;background-color:'+fadebgcolor+'"></div><div id="'+this.canvasbase+'_1" style="position:absolute;width:'+fadewidth+'px;height:'+fadeheight+'px;top:0;left:0;filter:progid:DXImageTransform.Microsoft.alpha(opacity=10);opacity:0.1;-moz-opacity:0.1;-khtml-opacity:0.1;background-color:'+fadebgcolor+'"></div></div>')
else
document.write('<div><img name="defaultslide'+this.slideshowid+'" src="'+this.postimages[0].src+'"></div>')

if (iebrowser&&dom||dom) //if IE5+ or modern browsers such as Firefox
this.startit()
else{
this.curimageindex++
setInterval("fadearray["+this.slideshowid+"].rotateimage()", this.delay)
}
}

function fadepic(obj){
if (obj.degree<100){
obj.degree+=10
if (obj.tempobj.filters&&obj.tempobj.filters[0]){
if (typeof obj.tempobj.filters[0].opacity=="number") //if IE6+
obj.tempobj.filters[0].opacity=obj.degree
else //else if IE5.5-
obj.tempobj.style.filter="alpha(opacity="+obj.degree+")"
}
else if (obj.tempobj.style.MozOpacity)
obj.tempobj.style.MozOpacity=obj.degree/101
else if (obj.tempobj.style.KhtmlOpacity)
obj.tempobj.style.KhtmlOpacity=obj.degree/100
else if (obj.tempobj.style.opacity&&!obj.tempobj.filters)
obj.tempobj.style.opacity=obj.degree/101
}
else{
clearInterval(fadeclear[obj.slideshowid])
obj.nextcanvas=(obj.curcanvas==obj.canvasbase+"_0")? obj.canvasbase+"_0" : obj.canvasbase+"_1"
obj.tempobj=iebrowser? iebrowser[obj.nextcanvas] : document.getElementById(obj.nextcanvas)
obj.populateslide(obj.tempobj, obj.nextimageindex)
obj.nextimageindex=(obj.nextimageindex<obj.postimages.length-1)? obj.nextimageindex+1 : 0
setTimeout("fadearray["+obj.slideshowid+"].rotateimage()", obj.delay)
}
}

fadeshow.prototype.populateslide=function(picobj, picindex){
var slideHTML=""
if (this.theimages[picindex][1]!="") //if associated link exists for image
slideHTML='<a href="'+this.theimages[picindex][1]+'" target="'+this.theimages[picindex][2]+'">'
slideHTML+='<img src="'+this.postimages[picindex].src+'" border="'+this.imageborder+'px">'
if (this.theimages[picindex][1]!="") //if associated link exists for image
slideHTML+='</a>'
picobj.innerHTML=slideHTML
}

fadeshow.prototype.rotateimage=function(){
if (this.pausecheck==1) //if pause onMouseover enabled, cache object
var cacheobj=this
if (this.mouseovercheck==1)
setTimeout(function(){cacheobj.rotateimage()}, 100)
else if (iebrowser&&dom||dom){
this.resetit()
var crossobj=this.tempobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
crossobj.style.zIndex++
fadeclear[this.slideshowid]=setInterval("fadepic(fadearray["+this.slideshowid+"])",50)
this.curcanvas=(this.curcanvas==this.canvasbase+"_0")? this.canvasbase+"_1" : this.canvasbase+"_0"
}
else{
var ns4imgobj=document.images['defaultslide'+this.slideshowid]
ns4imgobj.src=this.postimages[this.curimageindex].src
}
this.curimageindex=(this.curimageindex<this.postimages.length-1)? this.curimageindex+1 : 0
}

fadeshow.prototype.resetit=function(){
this.degree=10
var crossobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
if (crossobj.filters&&crossobj.filters[0]){
if (typeof crossobj.filters[0].opacity=="number") //if IE6+
crossobj.filters(0).opacity=this.degree
else //else if IE5.5-
crossobj.style.filter="alpha(opacity="+this.degree+")"
}
else if (crossobj.style.MozOpacity)
crossobj.style.MozOpacity=this.degree/101
else if (crossobj.style.KhtmlOpacity)
crossobj.style.KhtmlOpacity=this.degree/100
else if (crossobj.style.opacity&&!crossobj.filters)
crossobj.style.opacity=this.degree/101
}

fadeshow.prototype.startit=function(){
var crossobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
this.populateslide(crossobj, this.curimageindex)
if (this.pausecheck==0){ //IF SLIDESHOW SHOULD PAUSE ONMOUSEOVER
var cacheobj=this
var crossobjcontainer=iebrowser? iebrowser["master"+this.slideshowid] : document.getElementById("master"+this.slideshowid)
crossobjcontainer.onmouseover=function(){cacheobj.mouseovercheck=1}
crossobjcontainer.onmouseout=function(){cacheobj.mouseovercheck=0}
}
this.rotateimage()
}
</script>

<div  style="position: absolute; margin-left:0px;; top:-10px ; width: 900; height: 200;">
<script type="text/javascript">
new fadeshow (fadeimages, 900,200, 0, 3000, 1, "R")
</script>
</div>

</td><td>

<a href=http:// class=naviorang>About me</a>

</td><td>

</td><td>

<a href=http:// class=navigruen>Stuff</a>

</td><td>

</td><td>

</td></tr></table>
<div id="tabledescription">
</div></div>

<div style="overflow: visible; position: absolute; width: 185px;  left: 165px; top:400px"> 
<div class=box>
<p class=bombastiic>Stuff </p>
<font>
lest euch vorher die Regeln durch !
</br></br>
<table id="table1" width="100%" border="0"><tbody>
<tr valign="top">
<td style="width: 50%">

<a href=http://  class=navi>Icons</a>
<a href=http://  class=navi2>Wallies</a>
<a href=http:// class=navi1>Layouts</a>
</td>
<td>

<a href=http:// class=navi1>Material</a>
<a href=http:// class=navi>PNGs</a>
<a href=http:// class=navi2>Textures</a>

</td>
</tr>
</tbody></table>

</center>
</font>
</div>

<div class=box>
<p class=bombastiic>Affiliates </p>
<font>

Affiliates werden noch gesucht.
</br></br>
<table id="table1" width="100%" border="0"><tbody>
<tr valign="top">
<td style="width: 50%">

</td>
<td>

</td>
</tr>
</tbody></table>

</center>
</font>
</div>

<div class=box>
<p class=bombastiic> Credits </p>
<a href="http://bombastiic.de.tl" class=navi target=blank> Designer </a> 
<a href="http://hab-die-seite-vergessen-sorrrry-falls-sie-jemand-findet-kann-er-was-sagen.de" class=navi1 target=blank> Bilder </a> 
<a href="http://browse.deviantart.com/?q=white%20light%20texture&order=9&offset=24#/d2obxc6" class=navi target=blank> Textur</a> 
</div>
</div>

CSS-Code ohne Style Tags:

#extraDiv1 {display: none;}
 #extraDiv2 {display: none;}
 #extraDiv3 {display: none;}
 #extraDiv4 {display: none;}
 #extraDiv5 {display: none;}
 #extraDiv6 {display: none;}
 #pre_header {display: none;}
 #post_header {display: none;}
 #pre_content {display: none;}
#nav{display:none;}
 #bombastiic_content {display: none;}
 div.header{display: none;}
h2#title{display: none;}

a:link {
color: #9c0000;
font-family: tahoma, arial;
text-decoration: none;}

a:visited {
color: #5c0000;
font-family: tahoma, arial;
text-decoration: none;}

a:hover {
color: #5c0000;
font-family: tahoma, arial;
border-bottom: 0px dotted #bababa;}

body {
overflow-x: hidden;
}

#content {
position: absolute;
top:400px;
padding-left: 4px;
padding-right: 4px;
padding-top: 2px;
margin-left:350px;
width: 435px;
color:#333333;
font-family: tahoma,arial;
font-size:  11px;
text-align: justify;
word-spacing: px;
letter-spacing: 1px;
overflow:auto;
background-color: #F2F2F2;
-moz-opacity: 0.70; 
opacity: 0.70;
}

#Header {
position: absolute;
top:263px;
margin-left:150px;
width: 650px;
height: 650px;
background-image: url(http://www10.pic-upload.de/03.07.12/6bd39kqr2jaz.jpg);
background-repeat:no-repeat;
}

A.navirot:link, A.navirot:active, A.navirot:visited {
text-decoration: none;
padding-top: 0px;
padding-bottom: 0px;
padding-left: 4px;
padding-right: 5px;
text-transform: uppercase; 
text-align: center;  
font-family: Arial; 
font-size : 14px ;  
color: #000000;  
letter-spacing: 2px; 
line-height: 15px;
border-left: 15px solid #FF0000;
}

A.navirot:hover {  
padding-top: 0px;
padding-bottom: 0px;
padding-left: 4px;
padding-right: 5px;
text-transform: uppercase; 
text-align: center;  
font-family: Arial; 
font-size : 14px ;  
color: #FF0000;  
letter-spacing: 2px; 
line-height: 15px; 
border-left: 15px solid #A4A4A4; 
}

A.naviorang:link, A.naviorang:active, A.naviorang:visited {
text-decoration: none;
padding-top: 0px;
padding-bottom: 0px;
padding-left: 4px;
padding-right: 5px;
text-transform: uppercase; 
text-align: center;  
font-family: Arial; 
font-size : 14px ;  
color: #000000;  
letter-spacing: 2px; 
line-height: 15px;
border-left: 15px solid #FF8000;
}

A.naviorang:hover {  
padding-top: 0px;
padding-bottom: 0px;
padding-left: 4px;
padding-right: 5px;
text-transform: uppercase; 
text-align: center;  
font-family: Arial; 
font-size : 14px ;  
color: #FF8000;  
letter-spacing: 2px; 
line-height: 15px; 
border-left: 15px solid #A4A4A4; 
}

A.navigelb:link, A.navigelb:active, A.navigelb:visited {
text-decoration: none;
padding-top: 0px;
padding-bottom: 0px;
padding-left: 4px;
padding-right: 5px;
text-transform: uppercase; 
text-align: center;  
font-family: Arial; 
font-size : 14px ;  
color: #000000;  
letter-spacing: 2px; 
line-height: 15px;
border-left: 15px solid #FFFF00;
}

A.navigelb:hover {  
padding-top: 0px;
padding-bottom: 0px;
padding-left: 4px;
padding-right: 5px;
text-transform: uppercase; 
text-align: center;  
font-family: Arial; 
font-size : 14px ;  
color: #868A08;  
letter-spacing: 2px; 
line-height: 15px; 
border-left: 15px solid #A4A4A4; 
}

A.navigruen:link, A.navigruen:active, A.navigruen:visited {
text-decoration: none;
padding-top: 0px;
padding-bottom: 0px;
padding-left: 4px;
padding-right: 5px;
text-transform: uppercase; 
text-align: center;  
font-family: Arial; 
font-size : 14px ;  
color: #000000;  
letter-spacing: 2px; 
line-height: 15px;
border-left: 15px solid #01DF01;
}

A.navigruen:hover {  
padding-top: 0px;
padding-bottom: 0px;
padding-left: 4px;
padding-right: 5px;
text-transform: uppercase; 
text-align: center;  
font-family: Arial; 
font-size : 14px ;  
color: #01DF01;  
letter-spacing: 2px; 
line-height: 15px; 
border-left: 15px solid #A4A4A4; 
}

A.naviblau:link, A.naviblau:active, A.naviblau:visited {
text-decoration: none;
padding-top: 0px;
padding-bottom: 0px;
padding-left: 4px;
padding-right: 5px;
text-transform: uppercase; 
text-align: center;  
font-family: Arial; 
font-size : 14px ;  
color: #000000;  
letter-spacing: 2px; 
line-height: 15px;
border-left: 15px solid #0174DF;
}

A.naviblau:hover {  
padding-top: 0px;
padding-bottom: 0px;
padding-left: 4px;
padding-right: 5px;
text-transform: uppercase; 
text-align: center;  
font-family: Arial; 
font-size : 14px ;  
color: #0174DF;  
letter-spacing: 2px; 
line-height: 15px; 
border-left: 15px solid #A4A4A4; 
}

A.navilila:link, A.navilila:active, A.navilila:visited {
text-decoration: none;
padding-top: 0px;
padding-bottom: 0px;
padding-left: 4px;
padding-right: 5px;
text-transform: uppercase; 
text-align: center;  
font-family: Arial; 
font-size : 14px ;  
color: #000000;  
letter-spacing: 2px; 
line-height: 15px;
border-left: 15px solid #A901DB;
}

A.navilila:hover {  
padding-top: 0px;
padding-bottom: 0px;
padding-left: 4px;
padding-right: 5px;
text-transform: uppercase; 
text-align: center;  
font-family: Arial; 
font-size : 14px ;  
color: #A901DB;  
letter-spacing: 2px; 
line-height: 15px; 
border-left: 15px solid #A4A4A4; 
}

A.navi:link, A.navi:active, A.navi:visited {
display: block;
text-decoration: none;
padding-left: 9px;
font-family: arial;
font-size: 10px;
margin-bottom: 2px;
border-left: 2px solid #F1F1F1;
text-transform:uppercase;
letter-spacing: 1px;
color: #818181;
text-align: left;
line-height: 10px;}

A.navi:hover {
display: block;
padding-left: 9px;
font-family: arial;
font-size: 10px;
margin-bottom: 2px;;
border-left: 2px solid #FF0000;
text-transform:uppercase;
letter-spacing: 1px;
color: #FF0000;
text-align: left;
line-height: 10px;}

A.navi1:link, A.navi1:active, A.navi1:visited {
display: block;
text-decoration: none;
padding-left: 9px;
font-family: arial;
font-size: 10px;
margin-bottom: 2px;
border-left: 2px solid #F1F1F1;
text-transform:uppercase;
letter-spacing: 1px;
color: #818181;
text-align: left;
line-height: 10px;}

A.navi1:hover {
display: block;
padding-left: 9px;
font-family: arial;
font-size: 10px;
margin-bottom: 2px;;
border-left: 2px solid #0040FF;
text-transform:uppercase;
letter-spacing: 1px;
color: #0040FF;
text-align: left;
line-height: 10px;}

A.navi2:link, A.navi2:active, A.navi2:visited {
display: block;
text-decoration: none;
padding-left: 9px;
font-family: arial;
font-size: 10px;
margin-bottom: 2px;
border-left: 2px solid #F1F1F1;
text-transform:uppercase;
letter-spacing: 1px;
color: #818181;
text-align: left;
line-height: 10px;}

A.navi2:hover {
display: block;
padding-left: 9px;
font-family: arial;
font-size: 10px;
margin-bottom: 2px;;
border-left: 2px solid #04B431;
text-transform:uppercase;
letter-spacing: 1px;
color: #04B431;
text-align: left;
line-height: 10px;}

.bombastiic{
font-family: arial;
 font-size: 9pt;
padding-left: 4px;
padding-top: 2px;
color: #000000;
text-transform: none; 
text-align: left;
margin-left: 2px;
margin-right: 8px;
line-height: 12 px;
letter-spacing: 1px;
background-image: url(http://www7.pic-upload.de/05.07.12/k4fa23m1v3ch.jpg);
-moz-opacity: 0.90; 
opacity: 0.90;
}

TEXTAREA {
margin: 10px;
color: #363636;
font-family: Arial; 
font-size : 11px ;
padding: 5px;
background-color: #D8D8D8;
width:150;
border: 1px solid #708090;

}

.box{
font-family: arial;
font-size: 8pt;
padding-left: 4px;
padding-top: 2px;
color: #000000;
text-transform: none; 
text-align: left;
margin-left: 2px;
margin-right: 2px;
letter-spacing: 1px;
background-color: #F2F2F2;
-moz-opacity: 0.70; 
opacity: 0.70;
}