Hallo,
in Anlehnung an diesen Thread:
http://www.homepage-baukasten.de/forum/viewtopic.php?t=53911
habe ich mir für die anderen Designs, welche keine Headerfunktion haben, mal was ausgedacht. Ich habe versucht, wo immer es ging CSS einzusetzen.
Design-Men:
Hier gibt es zwei Header. Header 1 (148 x 179) das kleine Bild, mit den zwei Männern und Header 2 (597 x 179) das große daneben. Bsp.: http://www.o-4-n-men.de.tl
Einfügen, bei Text über dem Design:
Zitat: <style type="text/css">
/*Bild1(148 x 179)*/
img[src="http://theme.webme.com/designs/men/img/h1.jpg"]
{
display:none;
}
tr[height="179"]:first-child{
background-image:url(URL zu Header 1);
}
/*Bild2(597 x 179)*/
td[width="597"][height="179"][style]
{
background-image:url(URL zu Header 2)!important;
}
</style>
URL zu den jeweiligen Bildern
Design-Yellow:
Breite des Header 760px, Höhe variabel (siehe unten). Bsp.: http://www.o-4-n-yellow.de.tl
Einfügen, bei Text unter dem Design:
Zitat: <script type="text/javascript">
//760 x X
//URL des Headers
var headerSrc = 'URL zum Header';
//Höhe des Headers
var headerHeight= 200;
//Rechte Boxen?
var boxes = X;
//Ab hier nichts mehr ändern
var done = false;
var i;
var allTables=document.getElementsByTagName('table');
var newTR=document.createElement('tr');
var newTD=document.createElement('td');
newTR.style.height = headerHeight + 'px';
newTR.style.backgroundImage= 'url(' + headerSrc + ')';
boxes ? newTD.colSpan = '3' : newTD.colSpan = '2';
newTR.appendChild(newTD);
for(i = 0; (i < allTables.length) && (!done); i++)
{
if((allTables[i].width == '760') && (allTables[i].border == '0') && (allTables[i].align == 'center'))
{
allTables[i].insertBefore(newTR, allTables[i].firstChild);
done = true;
}
}
</script>
URL zum Header
Höhe des Headers in pixel ohne px. Hier ist also eine Höhe von 200 Pixel definiert.
Habt ihr rechte Boxen? Wenn ja dann X mit true ersetzen, sonst X mit false ersetzen
Design-Games:
Breite des Header 762px, Höhe 127px. Bsp.: http://www.o-4-n-games.de.tl
Einfügen, bei Text über dem Design:
Zitat: <style type="text/css">
/*762 x 127*/
/*Header*/
td[background="http://theme.webme.com/designs/gaming/Bilder/header.gif"]
{
background-image:url(URL zum Header)!important;
}
/*Heli teil in der Navi*/
td[background="http://theme.webme.com/designs/gaming/Bilder/navi.gif"]
{
background:none!important;
}
/*Heli teil im content*/
td[background="http://theme.webme.com/designs/gaming/Bilder/google.gif"]
{
background:none!important;
}
</style>
URL zum Header
Design-Music:
Breite des Header 798px, Höhe variabel (siehe unten). Bsp.: http://www.o-4-n-music.de.tl
Einfügen, bei Text unter dem Design:
Zitat: <script type="text/javascript">
//798 x X
//URL des Headers
var headerSrc = 'URL zum Header';
//Höhe des Headers
var headerHeight= 200;
//Ab hier nichts mehr ändern
var done = false;
var i;
var trs = 0;
var element = document.getElementById('tablebody');
var newTR = document.createElement('tr');
var newTD = document.createElement('td');
newTD.colSpan = '2';
newTR.style.height = headerHeight + 'px';
newTR.style.backgroundImage = 'url(' + headerSrc +')';
newTR.appendChild(newTD);
for(i = 0; (i < element.childNodes.length) && (!done); i++)
{
if(element.childNodes[i].nodeName == 'TBODY')
{
while(trs != 3)
{
if(element.childNodes[i].firstChild.nodeName == 'TR')
trs++;
element.childNodes[i].removeChild(element.childNodes[i].firstChild);
}
element.childNodes[i].insertBefore(newTR, element.childNodes[i].firstChild);
done = true;
}
}
</script>
URL zum Header
Höhe des Headers in pixel ohne px. Hier ist also eine Höhe von 200 Pixel definiert.
Design-Football:
Breite des Header 699px, Höhe 171px. Bsp.: http://www.o-4-n-football.de.tl
Einfügen, bei Text über dem Design:
Zitat: <style type="text/css">
/*699 x 171*/
td[background="http://theme.webme.com/designs/fussball/Bilder/header.gif"]
{
background-image:url(URL zum Header)!important;
}
</style>
URL zum Header
Design-Holidays:
Breite des Header 878px, Höhe 317px. Bsp.: http://www.o-4-n-holidays.de.tl
Einfügen, bei Text über dem Design:
Zitat: <style type="text/css">
/*878 x 317*/
td[style="background-image: url(http://theme.webme.com/designs/urlaub/Bilder/hawaii-theme3_02.jpg); width: 878px; height: 317px;"]
{
background-image: url(URL zum Header
)!important;
}
</style>
URL zum Header
Design-Skater:
Breite des Header 1000px, Höhe 254px. Bsp.: http://www.o-4-n-skater.de.tl
Einfügen, bei Text unter dem Design:
Zitat: <style type="text/css">
body > table[width="1000"] > tbody > tr > td[height="254"][colspan="2"] img, td[background="http://theme.webme.com/designs/skater/Bilder/5.gif"]{display:none;}
body > table[width="1000"] > tbody > tr > td[height="254"][colspan="2"] {background-image:url(http://img.webme.com/pic/o/o-4-n-skater/skater.png);}
</style>
URL zum Header
Design-Animals:
Breite des Header 788px, Höhe 202px. Bsp.: http://www.o-4-n-animals.de.tl
Einfügen, bei Text über dem Design:
Zitat: <style type="text/css">
/*788 x 202*/
td[background="http://theme.webme.com/designs/tiere/Bilder/header_hunde.gif"]
{
background-image:url(URL zum Header);
}
</style>
URL zum Header
Design-Beige:
Breite des Header 459px, Höhe 95px. Bsp.: http://www.o-4-n-beige.de.tl
Einfügen, bei Text unter dem Design:
Zitat: <script type="text/javascript">
//459 x 95
//URL des Headers
var headerSrc = 'URL zum Header';
//Ab hier nichts mehr ändern
var i;
var done = false;
var allImgs = document.getElementsByTagName('img');
for(i = 0; (i < allImgs.length) && (!done); i++)
{
if(allImgs[i].src == 'http://theme.webme.com/designs/beige/images/header_illustration.gif')
{
allImgs[i].src = headerSrc;
done = true;
}
}
</script>
URL zum Header
Design-Green:
Breite des Header 739px, Höhe 79px. Bsp.: http://www.o-4-n-green.de.tl
Einfügen, bei Text unter dem Design:
Zitat: <script type="text/javascript">
//739 x 79
//URL des Headers
var headerSrc = 'URL zum Header';
//Ab hier nichts mehr ändern
var i;
var done = false;
var allImgs = document.getElementsByTagName('img');
for(i = 0; (i < allImgs.length) && (!done); i++)
{
if(allImgs[i].src == 'http://theme.webme.com/designs/green/images/header.jpg')
{
allImgs[i].src = headerSrc;
done = true;
}
}
</script>
URL zum Header
Design-Cars:
Breite des Header 925px, Höhe variabel (siehe unten). Bsp.: http://www.o-4-n-cars.de.tl
Einfügen, bei Text unter dem Design:
Zitat: <script type="text/javascript">
//925 x X
//URL des Headers
var headerSrc = 'URL zum Header';
//Höhe des Headers
var headerHeight= 200;
//Ab hier nichts mehr ändern
var i, j;
var temp;
var done = false;
elements = document.getElementsByTagName('tbody');
var newTR = document.createElement('tr');
var newTD = document.createElement('td');
newTD.colSpan = 2;
newTR.style.height = headerHeight + 'px';
newTR.style.backgroundImage = 'url(' + headerSrc + ')';
newTR.appendChild(newTD);
for(i = 0; (i < elements.length) && (!done); i++)
{
if((elements[i].parentNode.width == '925') && (elements[i].parentNode.cellSpacing == '0') && (elements[i].parentNode.cellPadding == '0') && (elements[i].parentNode.border == '0') && (elements[i].parentNode.align == 'center'))
{
temp = elements[i].childNodes;
elements[i].removeChild(elements[i].firstChild);
for(j = 0; j < temp.length; j++)
{
if(temp[j].nodeName != 'TR' )
elements[i].removeChild(temp[j]);
}
for(j = 0; (j < elements.length) && (!done); j++)
{
if(elements[i].firstChild.childNodes[j].nodeName == 'TD')
{
elements[i].firstChild.childNodes[j].style.width = '172px';
done = true;
}
}
elements[i].insertBefore(newTR, elements[i].firstChild);
}
}
</script>
URL zum Header
Höhe des Headers in pixel ohne px. Hier ist also eine Höhe von 200 Pixel definiert.
Design-Anime:
Breite des Header 734px, Höhe variabel (siehe unten). Bsp.: http://www.o-4-n-anime.de.tl
Einfügen, bei Text unter dem Design:
Zitat: <script type="text/javascript">
//734 x X
//URL des Headers
var headerSrc = 'URL zum Header';
//Höhe des Headers
var headerHeight= 200;
//Rechte Boxen?
var boxes = X;
//Ab hier nichts mehr ändern
var i, j;
var temp;
var done = false;
var trs = 0;
elements = document.getElementsByTagName('img');
var newTR = document.createElement('tr');
var newTD = document.createElement('td');
boxes ? newTD.colSpan = '3' : newTD.colSpan = '2';
newTR.style.height = headerHeight + 'px';
newTR.style.backgroundImage = 'url(' + headerSrc + ')';
newTR.appendChild(newTD);
for(i = 0; (i < elements.length) && (!done); i++)
{
if(elements[i].src == 'http://theme.webme.com/designs/anime/Bilder/h1.gif')
{
temp = elements[i].parentNode.parentNode.parentNode;
elements = temp.childNodes;
for(j = 0; (j < elements.length) && (!done); j++)
{
if(elements[j].nodeName = 'TR')
{
trs++;
temp.removeChild(elements[j]);
if(trs == 2)
{
temp.insertBefore(newTR, temp.firstChild);
done = true;
}
}
}
}
}
</script>
URL zum Header
Höhe des Headers in pixel ohne px. Hier ist also eine Höhe von 200 Pixel definiert.
Habt ihr rechte Boxen? Wenn ja dann X mit true ersetzen, sonst X mit false ersetzen
Design-Kaki:
Breite des Header 782px, Höhe variabel (siehe unten). Bsp.: http://www.o-4-n-kaki.de.tl
Einfügen, bei Text unter dem Design:
Zitat: <script type="text/javascript">
//782 x X
//URL des Headers
var headerSrc = 'URL zum Header';
//Höhe des Headers
var headerHeight= 200;
//Ab hier nichts mehr ändern
var i, j;
var temp;
var done = false;
elements = document.getElementsByTagName('img');
for(i = 0; (i < elements.length) && (!done); i++)
{
if(elements[i].src == 'http://theme.webme.com/designs/kaki/images/header/header_cut.jpg')
{
temp = elements[i].parentNode.parentNode.parentNode.parentNode.parentNode;
while(temp.childNodes.length > 0)
{
temp.removeChild(temp.firstChild);
}
temp.style.height = headerHeight + 'px';
temp.style.backgroundImage = 'url(' + headerSrc + ')';
}
}
</script>
URL zum Header
Höhe des Headers in pixel ohne px. Hier ist also eine Höhe von 200 Pixel definiert.
Sämtliche Header auf meinen Beispielseiten dienen nur der Verdeutlichung. Ich hatte keine Lust, mir 13 richtige Header zumachen.
Zuletzt bearbeitet von o-4-n am 23.02.2015, 18:17, insgesamt 5-mal bearbeitet
|
