Hintergrund

Fragen zu allen Themen rund ums Programmieren außerhalb von phpBB können hier gestellt werden - auch zu anderen Programmiersprachen oder Software wie Webservern und Editoren.
eXBallisto
Mitglied
Beiträge: 8
Registriert: 14.10.2005 13:55

Beitrag von eXBallisto »

<html>
<head>
<title>Titel der Datei</title>
<style type="text/css">
body {
padding: 0;
margin: 0;
}

#background {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 1;
}

#content {
position: relative;
z-index: 2;
padding: 1em;
}
</style>
</head>
<body>
</body>
</html>


so müsste es gehn^^
Kiss News
Mitglied
Beiträge: 1640
Registriert: 31.05.2004 02:04
Wohnort: Österreich
Kontaktdaten:

Beitrag von Kiss News »

danke, aber funktioniert bei mir so nicht :roll:
www.sushimaterial.com
fanrpg
Mitglied
Beiträge: 2909
Registriert: 13.12.2004 22:41

Beitrag von fanrpg »

Kiss News hat geschrieben:danke, aber funktioniert bei mir so nicht :roll:
www.sushimaterial.com
Doch funktioniert perfekt (Opera)
und im Firefox auch
und im IE auch o.ô

und ersetze

Code: Alles auswählen

<body background="FujiHintergrundbild.jpg" onload="dynAnimation()">
mit:

Code: Alles auswählen

<body background="FujiHintergrundbild.jpg" onload="dynAnimation()" id="background">
Benutzeravatar
Pyramide
Ehrenadmin
Beiträge: 12734
Registriert: 19.04.2001 02:00
Wohnort: Meschede

Beitrag von Pyramide »

Hier mal eine Beispieldatei, wo noch zusätzlich ein Würgaround für den IE eingebaut ist, damit der das Bild zumindest normal anzeigt: http://pyra.cat-proof.de/temp/hintergrund.html
KB:knigge
Kiss News
Mitglied
Beiträge: 1640
Registriert: 31.05.2004 02:04
Wohnort: Österreich
Kontaktdaten:

Beitrag von Kiss News »

hier ist der Code, den ich habe:
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Euro Handel Sushimaterial.com</title>
<style type="text/css">
body {
padding: 0;
margin: 0;
}

#background {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 1;
}

#content {
position: relative;
z-index: 2;
padding: 1em;
}
</style>

<script LANGUAGE="JavaScript" FPTYPE="dynamicanimation">
<!--
// If you want to change this script, you must also make the following
// changes so that FrontPage will not overwrite your new script.
// In the script tag, change type="dynamicanimation" to type="mydynamicanimation"
// In the first script statement, change "dynamicanimation" to "mydynamicanimation"
// Throughout the HTML content, change dynamicanimation= to mydynamicanimation=
// Change function dynAnimation to function mydynAnimation
// In the body tag, change onload="dynAnimation()" to onload="mydynAnimation()"
dynamicanimAttr = "dynamicanimation"
animateElements = new Array()
currentElement = 0
speed = 0
stepsZoom = 8
stepsWord = 8
stepsFly = 12
stepsSpiral = 16
steps = stepsZoom
step = 0
outString = ""
function dynAnimation()
{
var ms = navigator.appVersion.indexOf("MSIE")
ie4 = (ms>0) && (parseInt(navigator.appVersion.substring(ms+5, ms+6)) >= 4)
if(!ie4)
{
if((navigator.appName == "Netscape") &&
(parseInt(navigator.appVersion.substring(0, 1)) >= 4))
{
for (index=document.layers.length-1; index >= 0; index--)
{
layer=document.layers[index]
if (layer.left==10000)
layer.left=0
}
}
return
}
for (index=document.all.length-1; index >= document.body.sourceIndex; index--)
{
el = document.all[index]
animation = el.getAttribute(dynamicanimAttr, false)
if(null != animation)
{
if(animation == "dropWord" || animation == "flyTopRightWord" || animation == "flyBottomRightWord")
{
ih = el.innerHTML
outString = ""
i1 = 0
iend = ih.length
while(true)
{
i2 = startWord(ih, i1)
if(i2 == -1)
i2 = iend
outWord(ih, i1, i2, false, "")
if(i2 == iend)
break
i1 = i2
i2 = endWord(ih, i1)
if(i2 == -1)
i2 = iend
outWord(ih, i1, i2, true, animation)
if(i2 == iend)
break
i1 = i2
}
document.all[index].innerHTML = outString
document.all[index].style.posLeft = 0
document.all[index].setAttribute(dynamicanimAttr, null)
}
if(animation == "zoomIn" || animation == "zoomOut")
{
ih = el.innerHTML
outString = "<SPAN " + dynamicanimAttr + "=\"" + animation + "\" style=\"position: relative; left: 10000;\">"
outString += ih
outString += "</SPAN>"
document.all[index].innerHTML = outString
document.all[index].style.posLeft = 0
document.all[index].setAttribute(dynamicanimAttr, null)
}
}
}
i = 0
for (index=document.body.sourceIndex; index < document.all.length; index++)
{
el = document.all[index]
animation = el.getAttribute(dynamicanimAttr, false)
if (null != animation)
{
if(animation == "flyLeft")
{
el.style.posLeft = 10000-offsetLeft(el)-el.offsetWidth
el.style.posTop = 0
}
else if(animation == "flyRight")
{
el.style.posLeft = 10000-offsetLeft(el)+document.body.offsetWidth
el.style.posTop = 0
}
else if(animation == "flyTop" || animation == "dropWord")
{
el.style.posLeft = 0
el.style.posTop = document.body.scrollTop-offsetTop(el)-el.offsetHeight
}
else if(animation == "flyBottom")
{
el.style.posLeft = 0
el.style.posTop = document.body.scrollTop-offsetTop(el)+document.body.offsetHeight
}
else if(animation == "flyTopLeft")
{
el.style.posLeft = 10000-offsetLeft(el)-el.offsetWidth
el.style.posTop = document.body.scrollTop-offsetTop(el)-el.offsetHeight
}
else if(animation == "flyTopRight" || animation == "flyTopRightWord")
{
el.style.posLeft = 10000-offsetLeft(el)+document.body.offsetWidth
el.style.posTop = document.body.scrollTop-offsetTop(el)-el.offsetHeight
}
else if(animation == "flyBottomLeft")
{
el.style.posLeft = 10000-offsetLeft(el)-el.offsetWidth
el.style.posTop = document.body.scrollTop-offsetTop(el)+document.body.offsetHeight
}
else if(animation == "flyBottomRight" || animation == "flyBottomRightWord")
{
el.style.posLeft = 10000-offsetLeft(el)+document.body.offsetWidth
el.style.posTop = document.body.scrollTop-offsetTop(el)+document.body.offsetHeight
}
else if(animation == "spiral")
{
el.style.posLeft = 10000-offsetLeft(el)-el.offsetWidth
el.style.posTop = document.body.scrollTop-offsetTop(el)-el.offsetHeight
}
else if(animation == "zoomIn")
{
el.style.posLeft = 10000
el.style.posTop = 0
}
else if(animation == "zoomOut")
{
el.style.posLeft = 10000
el.style.posTop = 0
}
else
{
el.style.posLeft = 10000-offsetLeft(el)-el.offsetWidth
el.style.posTop = 0
}
el.initLeft = el.style.posLeft
el.initTop = el.style.posTop
animateElements[i++] = el
}
}
window.setTimeout("animate();", speed)
}
function offsetLeft(el)
{
x = el.offsetLeft
for (e = el.offsetParent; e; e = e.offsetParent)
x += e.offsetLeft;
return x
}
function offsetTop(el)
{
y = el.offsetTop
for (e = el.offsetParent; e; e = e.offsetParent)
y += e.offsetTop;
return y
}
function startWord(ih, i)
{
for(tag = false; i < ih.length; i++)
{
c = ih.charAt(i)
if(c == '<')
tag = true
if(!tag)
return i
if(c == '>')
tag = false
}
return -1
}
function endWord(ih, i)
{
nonSpace = false
space = false
while(i < ih.length)
{
c = ih.charAt(i)
if(c != ' ')
nonSpace = true
if(nonSpace && c == ' ')
space = true
if(c == '<')
return i
if(space && c != ' ')
return i
i++
}
return -1
}
function outWord(ih, i1, i2, dyn, anim)
{
if(dyn)
outString += "<SPAN " + dynamicanimAttr + "=\"" + anim + "\" style=\"position: relative; left: 10000;\">"
outString += ih.substring(i1, i2)
if(dyn)
outString += "</SPAN>"
}
function animate()
{
el = animateElements[currentElement]
animation = el.getAttribute(dynamicanimAttr, false)
step++
if(animation == "spiral")
{
steps = stepsSpiral
v = step/steps
rf = 1.0 - v
t = v * 2.0*Math.PI
rx = Math.max(Math.abs(el.initLeft), 200)
ry = Math.max(Math.abs(el.initTop), 200)
el.style.posLeft = Math.ceil(-rf*Math.cos(t)*rx)
el.style.posTop = Math.ceil(-rf*Math.sin(t)*ry)
}
else if(animation == "zoomIn")
{
steps = stepsZoom
el.style.fontSize = Math.ceil(50+50*step/steps) + "%"
el.style.posLeft = 0
}
else if(animation == "zoomOut")
{
steps = stepsZoom
el.style.fontSize = Math.ceil(100+200*(steps-step)/steps) + "%"
el.style.posLeft = 0
}
else
{
steps = stepsFly
if(animation == "dropWord" || animation == "flyTopRightWord" || animation == "flyBottomRightWord")
steps = stepsWord
dl = el.initLeft / steps
dt = el.initTop / steps
el.style.posLeft = el.style.posLeft - dl
el.style.posTop = el.style.posTop - dt
}
if (step >= steps)
{
el.style.posLeft = 0
el.style.posTop = 0
currentElement++
step = 0
}
if(currentElement < animateElements.length)
window.setTimeout("animate();", speed)
}
//-->
</script></head>

<body background="FujiHintergrundbild.jpg" onload="dynAnimation()" id="background">

<table border="0" cellpadding="0" cellspacing="0" width="100%" height="100%">
<tr>
<td
style="position: relative !important; left: 10000 !important; padding-left: 2; padding-right: 2; padding-top: 15"
valign="top" dynamicanimation="flyRight">&nbsp;&nbsp; <a href="indexEnglish.htm"><img
src="flagUK.jpg" width="28" height="17" alt="english version" border="0"></a>&nbsp;&nbsp; <font
face="Arial Black">english</font> <br>
<br>
</td>
<td style="padding-left: 2; padding-right: 2; padding-top: 15" valign="top"><p
align="center"><a href="Produkte.htm"><img src="Produkteklein.gif" width="89" height="26"
alt="Produkte" border="0"></a><a href="Angebote.htm"><img src="Angeboteklein.gif"
width="89" height="26" alt="Angebote" border="0"></a><a href="Rezepte.htm"><img
src="Rezepteklein.gif" width="74" height="26" alt="Rezepte" border="0"></a><a
href="Kontakt.htm"><img src="Kontaktklein.gif" width="79" height="26" alt="Kontakt"
border="0"></a><a href="UeberUns.htm"><img src="Ueberunstklein.gif" width="79" height="26"
alt="über uns" border="0"></a></td>
<td style="padding-left: 5; padding-right: 35; padding-top: 15" valign="top"><p
align="right"><img src="EuroHandelLogo.gif" width="108" height="58"
alt="Sushimaterial.com"><img src="EuroHandelLogoSchrift.gif" width="188" height="58"
alt="Euro Handel"></td>
</tr>
<tr>
<td style="padding-left: 17; padding-right: 35; padding-top: 15" valign="bottom"
colspan="3"><p align="center">&nbsp;</p>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td width="33%"></td>
<td width="33%"><img src="jeong%20reis%20v2transparent.gif" alt="Sushimaterial.com"
width="536" height="340"></td>
<td width="34%" valign="bottom"><p align="right"><a href="Jobs.htm"><img
src="ButtonJobs.gif" width="51" height="26" alt="Jobs" border="0"></a></td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
Der sollte laut den Angaben doch stimmen, oder nicht? Bei mir funktioniert er aber nicht, das Hintergrundbild passt sich NICHT an die Bildschirmeinstellungen an. Mit dem IE Workaround, wenn ich den Code auch dazugebe, funtzt gar nix mehr... :evil:

Auf dieser Seite funktioniert es: http://pyra.cat-proof.de/temp/hintergrund.html
Benutzeravatar
Pyramide
Ehrenadmin
Beiträge: 12734
Registriert: 19.04.2001 02:00
Wohnort: Meschede

Beitrag von Pyramide »

Das <body> Tag darf nicht das Hintergrundbild oder die id="background" haben, da es selbst die gesamte Seite enthält. Das ganze basiert auf den Eigenschaften zur Positionierung und Anzeige von Elementen (die gute alte Layer-Technik also :)).

Das background Element ist eigentlich ein ganz normales Bild, welches auf der Seite angezeigt wird. Durch die Angabe von top,left,width,height wird es auf die gesamte Seite ausgedehnt, und aufgrund position:fixed gelten diese Angaben relativ zum Browserfenster und nicht zur Seite (das Verwende ich z.B. auch für die Navigationsleiste meiner JMapMod-Doku). Und damit das Bild nicht die gesamte Seite überdeckt, wird es per z-index:1 hinter das content Element (kann ein einfaches <div> sein) gelegt.

Das position:relative dient übrigens nur dazu, daß der Browser das z-index:2 nicht ignoriert - das tut er nämlich bei allen Elementen, die nur im normalen Textfluss auftreten. Und die margin/padding Angaben sind ein Workaround für Opera, der das Bild sonst nur innerhalb der Inhaltsfläche von <body> darstellt und somit einen unschönen weißen Rahmen haben würde.

background und content müssen also immer zwei unterschiedliche Elemente sein, damit diese unabhängig voneinander positioniert werden können - im einfachsten Falle wie in meinem Beispiel einfach ein <img> und ein <div> direkt unterhalb von <body>.
KB:knigge
Kiss News
Mitglied
Beiträge: 1640
Registriert: 31.05.2004 02:04
Wohnort: Österreich
Kontaktdaten:

Beitrag von Kiss News »

Danke für die Info und Erklärung. Funktioniert aber trotzdem nicht bei mir:
http://www.sushimaterial.com/indexTest.htm

so sieht der Code aus...
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Euro Handel Sushimaterial.com</title>
<style type="text/css">
body {
padding: 0;
margin: 0;
}

#background {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 1;
}

#content {
position: relative;
z-index: 2;
padding: 1em;
}
</style>
<!--[if IE]>
<style type="text/css">
/*Würgaround für den IE, zumindest normales Hintergrundbild*/
#background {
display: none;
}

body {
background: url(windows95.jpg);
background-attachment: fixed;
}
</style>
<![endif]-->
<bgsound src="music1.mp3" loop="-1">
<script LANGUAGE="JavaScript" FPTYPE="dynamicanimation">
<!--
// If you want to change this script, you must also make the following
// changes so that FrontPage will not overwrite your new script.
// In the script tag, change type="dynamicanimation" to type="mydynamicanimation"
// In the first script statement, change "dynamicanimation" to "mydynamicanimation"
// Throughout the HTML content, change dynamicanimation= to mydynamicanimation=
// Change function dynAnimation to function mydynAnimation
// In the body tag, change onload="dynAnimation()" to onload="mydynAnimation()"
dynamicanimAttr = "dynamicanimation"
animateElements = new Array()
currentElement = 0
speed = 0
stepsZoom = 8
stepsWord = 8
stepsFly = 12
stepsSpiral = 16
steps = stepsZoom
step = 0
outString = ""
function dynAnimation()
{
var ms = navigator.appVersion.indexOf("MSIE")
ie4 = (ms>0) && (parseInt(navigator.appVersion.substring(ms+5, ms+6)) >= 4)
if(!ie4)
{
if((navigator.appName == "Netscape") &&
(parseInt(navigator.appVersion.substring(0, 1)) >= 4))
{
for (index=document.layers.length-1; index >= 0; index--)
{
layer=document.layers[index]
if (layer.left==10000)
layer.left=0
}
}
return
}
for (index=document.all.length-1; index >= document.body.sourceIndex; index--)
{
el = document.all[index]
animation = el.getAttribute(dynamicanimAttr, false)
if(null != animation)
{
if(animation == "dropWord" || animation == "flyTopRightWord" || animation == "flyBottomRightWord")
{
ih = el.innerHTML
outString = ""
i1 = 0
iend = ih.length
while(true)
{
i2 = startWord(ih, i1)
if(i2 == -1)
i2 = iend
outWord(ih, i1, i2, false, "")
if(i2 == iend)
break
i1 = i2
i2 = endWord(ih, i1)
if(i2 == -1)
i2 = iend
outWord(ih, i1, i2, true, animation)
if(i2 == iend)
break
i1 = i2
}
document.all[index].innerHTML = outString
document.all[index].style.posLeft = 0
document.all[index].setAttribute(dynamicanimAttr, null)
}
if(animation == "zoomIn" || animation == "zoomOut")
{
ih = el.innerHTML
outString = "<SPAN " + dynamicanimAttr + "=\"" + animation + "\" style=\"position: relative; left: 10000;\">"
outString += ih
outString += "</SPAN>"
document.all[index].innerHTML = outString
document.all[index].style.posLeft = 0
document.all[index].setAttribute(dynamicanimAttr, null)
}
}
}
i = 0
for (index=document.body.sourceIndex; index < document.all.length; index++)
{
el = document.all[index]
animation = el.getAttribute(dynamicanimAttr, false)
if (null != animation)
{
if(animation == "flyLeft")
{
el.style.posLeft = 10000-offsetLeft(el)-el.offsetWidth
el.style.posTop = 0
}
else if(animation == "flyRight")
{
el.style.posLeft = 10000-offsetLeft(el)+document.body.offsetWidth
el.style.posTop = 0
}
else if(animation == "flyTop" || animation == "dropWord")
{
el.style.posLeft = 0
el.style.posTop = document.body.scrollTop-offsetTop(el)-el.offsetHeight
}
else if(animation == "flyBottom")
{
el.style.posLeft = 0
el.style.posTop = document.body.scrollTop-offsetTop(el)+document.body.offsetHeight
}
else if(animation == "flyTopLeft")
{
el.style.posLeft = 10000-offsetLeft(el)-el.offsetWidth
el.style.posTop = document.body.scrollTop-offsetTop(el)-el.offsetHeight
}
else if(animation == "flyTopRight" || animation == "flyTopRightWord")
{
el.style.posLeft = 10000-offsetLeft(el)+document.body.offsetWidth
el.style.posTop = document.body.scrollTop-offsetTop(el)-el.offsetHeight
}
else if(animation == "flyBottomLeft")
{
el.style.posLeft = 10000-offsetLeft(el)-el.offsetWidth
el.style.posTop = document.body.scrollTop-offsetTop(el)+document.body.offsetHeight
}
else if(animation == "flyBottomRight" || animation == "flyBottomRightWord")
{
el.style.posLeft = 10000-offsetLeft(el)+document.body.offsetWidth
el.style.posTop = document.body.scrollTop-offsetTop(el)+document.body.offsetHeight
}
else if(animation == "spiral")
{
el.style.posLeft = 10000-offsetLeft(el)-el.offsetWidth
el.style.posTop = document.body.scrollTop-offsetTop(el)-el.offsetHeight
}
else if(animation == "zoomIn")
{
el.style.posLeft = 10000
el.style.posTop = 0
}
else if(animation == "zoomOut")
{
el.style.posLeft = 10000
el.style.posTop = 0
}
else
{
el.style.posLeft = 10000-offsetLeft(el)-el.offsetWidth
el.style.posTop = 0
}
el.initLeft = el.style.posLeft
el.initTop = el.style.posTop
animateElements[i++] = el
}
}
window.setTimeout("animate();", speed)
}
function offsetLeft(el)
{
x = el.offsetLeft
for (e = el.offsetParent; e; e = e.offsetParent)
x += e.offsetLeft;
return x
}
function offsetTop(el)
{
y = el.offsetTop
for (e = el.offsetParent; e; e = e.offsetParent)
y += e.offsetTop;
return y
}
function startWord(ih, i)
{
for(tag = false; i < ih.length; i++)
{
c = ih.charAt(i)
if(c == '<')
tag = true
if(!tag)
return i
if(c == '>')
tag = false
}
return -1
}
function endWord(ih, i)
{
nonSpace = false
space = false
while(i < ih.length)
{
c = ih.charAt(i)
if(c != ' ')
nonSpace = true
if(nonSpace && c == ' ')
space = true
if(c == '<')
return i
if(space && c != ' ')
return i
i++
}
return -1
}
function outWord(ih, i1, i2, dyn, anim)
{
if(dyn)
outString += "<SPAN " + dynamicanimAttr + "=\"" + anim + "\" style=\"position: relative; left: 10000;\">"
outString += ih.substring(i1, i2)
if(dyn)
outString += "</SPAN>"
}
function animate()
{
el = animateElements[currentElement]
animation = el.getAttribute(dynamicanimAttr, false)
step++
if(animation == "spiral")
{
steps = stepsSpiral
v = step/steps
rf = 1.0 - v
t = v * 2.0*Math.PI
rx = Math.max(Math.abs(el.initLeft), 200)
ry = Math.max(Math.abs(el.initTop), 200)
el.style.posLeft = Math.ceil(-rf*Math.cos(t)*rx)
el.style.posTop = Math.ceil(-rf*Math.sin(t)*ry)
}
else if(animation == "zoomIn")
{
steps = stepsZoom
el.style.fontSize = Math.ceil(50+50*step/steps) + "%"
el.style.posLeft = 0
}
else if(animation == "zoomOut")
{
steps = stepsZoom
el.style.fontSize = Math.ceil(100+200*(steps-step)/steps) + "%"
el.style.posLeft = 0
}
else
{
steps = stepsFly
if(animation == "dropWord" || animation == "flyTopRightWord" || animation == "flyBottomRightWord")
steps = stepsWord
dl = el.initLeft / steps
dt = el.initTop / steps
el.style.posLeft = el.style.posLeft - dl
el.style.posTop = el.style.posTop - dt
}
if (step >= steps)
{
el.style.posLeft = 0
el.style.posTop = 0
currentElement++
step = 0
}
if(currentElement < animateElements.length)
window.setTimeout("animate();", speed)
}
//-->
</script></head>

<body onload="dynAnimation()">

<img id="background" src="FujiHintergrundbild.jpg">
<div id="content">

<table border="0" cellpadding="0" cellspacing="0" width="100%" height="100%">
<tr>
<td
style="position: relative !important; left: 10000 !important; padding-left: 2; padding-right: 2; padding-top: 15"
valign="top" dynamicanimation="flyRight">&nbsp;&nbsp; <a href="indexEnglish.htm"><img
src="flagUK.jpg" width="28" height="17" alt="english version" border="0"></a>&nbsp;&nbsp; <font
face="Arial Black">english</font> <br>
<br>
</td>
<td style="padding-left: 2; padding-right: 2; padding-top: 15" valign="top"><p
align="center"><a href="Produkte.htm"><img src="Produkteklein.gif" width="89" height="26"
alt="Produkte" border="0"></a><a href="Angebote.htm"><img src="Angeboteklein.gif"
width="89" height="26" alt="Angebote" border="0"></a><a href="Rezepte.htm"><img
src="Rezepteklein.gif" width="74" height="26" alt="Rezepte" border="0"></a><a
href="Kontakt.htm"><img src="Kontaktklein.gif" width="79" height="26" alt="Kontakt"
border="0"></a><a href="UeberUns.htm"><img src="Ueberunstklein.gif" width="79" height="26"
alt="über uns" border="0"></a></td>
<td style="padding-left: 5; padding-right: 35; padding-top: 15" valign="top"><p
align="right"><img src="EuroHandelLogo.gif" width="108" height="58"
alt="Sushimaterial.com"><img src="EuroHandelLogoSchrift.gif" width="188" height="58"
alt="Euro Handel"></td>
</tr>
<tr>
<td style="padding-left: 17; padding-right: 35; padding-top: 15" valign="bottom"
colspan="3"><p align="center">&nbsp;</p>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td width="33%"></td>
<td width="33%"><img src="jeong%20reis%20v2transparent.gif" alt="Sushimaterial.com"
width="536" height="340"></td>
<td width="34%" valign="bottom"><p align="right"><a href="Jobs.htm"><img
src="ButtonJobs.gif" width="51" height="26" alt="Jobs" border="0"></a></td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</body>
</html>
fanrpg
Mitglied
Beiträge: 2909
Registriert: 13.12.2004 22:41

Beitrag von fanrpg »

Wofür ist eigentlich das JavaScript darin gut?
Benutzeravatar
Pyramide
Ehrenadmin
Beiträge: 12734
Registriert: 19.04.2001 02:00
Wohnort: Meschede

Beitrag von Pyramide »

Kiss News hat geschrieben:Funktioniert aber trotzdem nicht bei mir:
http://www.sushimaterial.com/indexTest.htm
Also bei mir funktioniert es schon (im Firefox). Du solltest allerdings noch den weißen Rand rechts+unten wegschneiden (ausser das ist so gewollt) und im IE-Workaround Teil des CSS die Referenz auf windows95.jpg ändern.

PS: Wenn du nochmal den gesamten Code in den Beitrag enifügst, lass bitte das Javascript weg

PS2:
SelfHTML hat geschrieben:Ferner sollten Sie sich beim Wunsch, Hintergrundmusik einzubinden, darüber im Klaren sein, dass die Mehrzahl der Anwender im Web genervt ist von dem Gedudel und sehr schnell wieder von solchen Seiten verschwindet.
KB:knigge
Kiss News
Mitglied
Beiträge: 1640
Registriert: 31.05.2004 02:04
Wohnort: Österreich
Kontaktdaten:

Beitrag von Kiss News »

also bei mir funktioniert es leider nicht (Internet Explorer):
http://www.sushimaterial.com/indexTest.htm

sieht so aus bei mir:

http://www.sushimaterial.com/Screenshot.jpg


ich habe in dem Teil:

<!--[if IE]>
<style type="text/css">
/*Würgaround für den IE, zumindest normales Hintergrundbild*/
#background {
display: none;
}

body {
background: url(windows95.jpg);
background-attachment: fixed;
}
</style><![endif]-->
nun die background url geändert auf FujiHintergrundbild.jpg, da das Hintergrundbild so heisst:
<!--[if IE]>
<style type="text/css">
/*Würgaround für den IE, zumindest normales Hintergrundbild*/
#background {
display: none;
}

body {
background: url(FujiHintergrundbild.jpg);
background-attachment: fixed;
}
</style><![endif]-->
gibt es denn irgendeine andere Art, ein Hintergrundbild immer so darstellen zu lassen, dass es immer exact einmal über den ganzen Bildschirm geht, egal welche Bildschirmeinstellung man hat?

den Hintergundsound möchte mein Chef haben :roll:
Antworten

Zurück zu „Coding & Technik“