nicht angemeldet
Bild am untersten browser-rand positionieren
Hallo! ich weiß jetzt garnicht ob man das mit js, dhtml, ... realisiert! ich möchte gerne dass ein kleines bild/layer immer ganz unten im browser erscheint! dh auch wenn ich das fenster verkleinere oder vergrößere soll sich vom bild die position so änder damit es wieder ganz unten positioniert ist! das selbe gilt auch beim scrollen des fensters! hat jemand ne idee wie ich das anstelle! vielen dank! gruß tom
-
Hallo Thomas,
ich möchte gerne dass ein kleines bild/layer immer ganz unten im browser erscheint! dh auch wenn ich das fenster verkleinere oder vergrößere soll sich vom bild die position so änder damit es wieder ganz unten positioniert ist! das selbe gilt auch beim scrollen des fensters! hat jemand ne idee wie ich das anstelle!
Du könntest es als Hintergrundbild einbinden:
<body style="background: fixed bottom right url(/pfad/zum/bild.jpg);">
Oder Du könntest es fest positionieren:
<div style="position: fixed; bottom: 0; right: 0; width: ...px; height: ...px;"><img src="bild.jpg" width="..." height="..."></div>
Letztere Methode geht nicht im Microsoft Internet Explorer, im Mozilla, Netscape 6+, Opera und Konqueror dagegen schon. Erstere Methode sollte auch im Internet Explorer funktionieren, allerdings kann da das Bild von anderen Elementen verdeckt werden. (Hintergrundbild eben)
Viele Grüße,
Christian-
Hallo Thomas,
ich möchte gerne dass ein kleines bild/layer immer ganz unten im browser erscheint! dh auch wenn ich das fenster verkleinere oder vergrößere soll sich vom bild die position so änder damit es wieder ganz unten positioniert ist! das selbe gilt auch beim scrollen des fensters! hat jemand ne idee wie ich das anstelle!
Du könntest es als Hintergrundbild einbinden:
<body style="background: fixed bottom right url(/pfad/zum/bild.jpg);">
Oder Du könntest es fest positionieren:
<div style="position: fixed; bottom: 0; right: 0; width: ...px; height: ...px;"><img src="bild.jpg" width="..." height="..."></div>
Letztere Methode geht nicht im Microsoft Internet Explorer, im Mozilla, Netscape 6+, Opera und Konqueror dagegen schon. Erstere Methode sollte auch im Internet Explorer funktionieren, allerdings kann da das Bild von anderen Elementen verdeckt werden. (Hintergrundbild eben)
Viele Grüße,
Christianhallo christian,
vielen dank erstmals! aber hintergrundbild ist nicht optimal! da ich ja nachher auf dieses bild drei links setzen möchte! deshalb dachte ich mir ich könnte dieses bild in einen layer packen und diesen dann so positionieren dass er sich die position "errechnet" und sich immer links unten auf der seite stellt (egal wie groß das fenster ist und wie weit runter- /hochgescrollt wurde)
-
Hallo Thomas,
vielen dank erstmals! aber hintergrundbild ist nicht optimal! da ich ja nachher auf dieses bild drei links setzen möchte! deshalb dachte ich mir ich könnte dieses bild in einen layer packen und diesen dann so positionieren dass er sich die position "errechnet" und sich immer links unten auf der seite stellt (egal wie groß das fenster ist und wie weit runter- /hochgescrollt wurde)
Ja, das geht, aber das ruckelt halt.
http://www.xs4all.nl/~ppk/js/fixedmenu.htmlViele Grüße,
Christian-
Hallo Thomas,
vielen dank erstmals! aber hintergrundbild ist nicht optimal! da ich ja nachher auf dieses bild drei links setzen möchte! deshalb dachte ich mir ich könnte dieses bild in einen layer packen und diesen dann so positionieren dass er sich die position "errechnet" und sich immer links unten auf der seite stellt (egal wie groß das fenster ist und wie weit runter- /hochgescrollt wurde)
Ja, das geht, aber das ruckelt halt.
http://www.xs4all.nl/~ppk/js/fixedmenu.htmlViele Grüße,
Christianhm eine frage hätte ich da noch! irgendwie versteh ich dieses script nicht! kannst mir bitte nochmal helfen??
-
Hallo Thomas,
hm eine frage hätte ich da noch! irgendwie versteh ich dieses script nicht! kannst mir bitte nochmal helfen??
Was genau verstehst Du denn daran nicht? Mit welchem Teil hast Du schwierigkeiten?
Viele Grüße,
Chrisitan-
Hallo Thomas,
hm eine frage hätte ich da noch! irgendwie versteh ich dieses script nicht! kannst mir bitte nochmal helfen??
Was genau verstehst Du denn daran nicht? Mit welchem Teil hast Du schwierigkeiten?
Viele Grüße,
Chrisitannaja hab das js eingefügt! aber was ich danach noch genau machen soll weiß ich nicht! bin ja eher der php coder aber damit kann ichs nicht machen. 1. weiß ich nicht wie und 2. dürfen sich die bestehenden html seiten nicht mehr mit dem namen verändern!
vielen dankt! tom
-
Hallo Thomas.
naja hab das js eingefügt!
Ganz so einfach ist es nicht. Du musst Dir schon die Anleitung, die dort steht durchlesen. Wenn Du Dir den Quelltext der Seite ansiehst, dann gibt es einen Script-Bereich. Essentiell musst Du diesen kopieren. Allerdings musst Du ihn auch noch etwas anpassen, damit er das Menü rechts unten anzeigt. Dich dürften dazu die Eigenschaften window.innerHeight für nicht-IE-Browser und die Eigenschaften document.body.offsetHeight für den IE interessieren.
aber was ich danach noch genau machen soll weiß ich nicht!
Du brauchst halt noch ein Div, dass die ID 'menu' hat. (<div id="menu">...</div>) Dieses <div> muss per CSS absolut positioniert sein. Es wird dann vom JavaScript verschoben. Außerdem musst Du im onload-Eventhandler von <body> noch ein init() reinschreiben, damit die Funktion ausgeführt wird.
- weiß ich nicht wie
Die Funktion movemenu interessiert Dich.
und 2. dürfen sich die bestehenden html seiten nicht mehr mit dem namen verändern!
Das ist nicht notwendig.
Viele Grüße,
Christian-
Hallo Thomas.
naja hab das js eingefügt!
Ganz so einfach ist es nicht. Du musst Dir schon die Anleitung, die dort steht durchlesen. Wenn Du Dir den Quelltext der Seite ansiehst, dann gibt es einen Script-Bereich. Essentiell musst Du diesen kopieren. Allerdings musst Du ihn auch noch etwas anpassen, damit er das Menü rechts unten anzeigt. Dich dürften dazu die Eigenschaften window.innerHeight für nicht-IE-Browser und die Eigenschaften document.body.offsetHeight für den IE interessieren.
aber was ich danach noch genau machen soll weiß ich nicht!
Du brauchst halt noch ein Div, dass die ID 'menu' hat. (<div id="menu">...</div>) Dieses <div> muss per CSS absolut positioniert sein. Es wird dann vom JavaScript verschoben. Außerdem musst Du im onload-Eventhandler von <body> noch ein init() reinschreiben, damit die Funktion ausgeführt wird.
- weiß ich nicht wie
Die Funktion movemenu interessiert Dich.
und 2. dürfen sich die bestehenden html seiten nicht mehr mit dem namen verändern!
Das ist nicht notwendig.
Viele Grüße,
Christianeigentlich wollte ichs links unten positionieren! hab es jetzt aber mal so probiert wie du es mir gesagt hast aber das funktioniert nicht!
-
Hallo Thomas,
eigentlich wollte ichs links unten positionieren!
Dann musst Du halt im Stylesheet den Wert von left von 85% auf 10px oder so etwas in der Art ändern.
hab es jetzt aber mal so probiert wie du es mir gesagt hast aber das funktioniert nicht!
»funktioniert nicht« ist eine sehr wage Fehlerbeschreibung. Ohne den Quelltext zu sehen, kann ich Dir nicht sagen, woran Du gescheitert bist.
Viele Grüße,
Christian-
Hallo Thomas,
eigentlich wollte ichs links unten positionieren!
Dann musst Du halt im Stylesheet den Wert von left von 85% auf 10px oder so etwas in der Art ändern.
hab es jetzt aber mal so probiert wie du es mir gesagt hast aber das funktioniert nicht!
»funktioniert nicht« ist eine sehr wage Fehlerbeschreibung. Ohne den Quelltext zu sehen, kann ich Dir nicht sagen, woran Du gescheitert bist.
Viele Grüße,
Christianhallo christian!
hab hier mal den auszug aus meiner html datei!
...
<body onload="init()" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="MM_preloadImages('../img/english_enable.gif','../img/italiano_enable.gif','../img/espanol_enable.gif','../img/francais_enable.gif')">
...
<div id="menu" style="position:absolute; left:10px; top:85%; width:148px; height:60px; z-index:11; background-color: #0000FF; layer-background-color: #0000FF; border: 1px none #000000;"></div>
...und hier noch das js:
...
var menu;
var theTop = 30;
var old = theTop;function init()
{
menu = new getObj('menu');
movemenu();
}function movemenu(init)
{
if (window.innerHeight)
{
pos = window.pageYOffset
}
else if (document.documentElement && document.documentElement.scrollTop)
{
pos = document.documentElement.scrollTop
}
else if (document.body)
{
pos = document.body.scrollTop
}
if (pos < theTop) pos = theTop;
else pos += 30;
if (pos == old)
{
menu.style.top = pos;
}
old = pos;
temp = setTimeout('movemenu()',500);
}
...-
Hallo Thomas,
hab hier mal den auszug aus meiner html datei!
...
<body onload="init()" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="MM_preloadImages('../img/english_enable.gif','../img/italiano_enable.gif','../img/espanol_enable.gif','../img/francais_enable.gif')">Zweimal onload solltest Du nicht machen. Besser:
<body ... onload="init(); MM_preloadImages('../img/english_enable.gif','../img/italiano_enable.gif','../img/espanol_enable.gif','../img/francais_enable.gif')">
und hier noch das js:
Du hast vergessen, die Funktion getObj von der Seite, die ich verlinkt habe, rauszukopieren. Deswegen funktioniert es auch nicht.
Viele Grüße,
Christian-
hallo christian! soweit funktioniert es auch! ich mag ja garnimma fragen! *g* aber wie bekomm i das jetzt hin dass es von unten aus positioniert wird?
-
Hallo Thomas,
soweit funktioniert es auch!
Prima.
aber wie bekomm i das jetzt hin dass es von unten aus positioniert wird?
Du hast diese Zeile:
pos = window.pageYOffset
Ersetze sie durch:
pos = window.pageYOffset + window.innerHeight - 80;
(80 sei hier die Höhe der Box)
Die Zeile
pos = document.documentElement.scrollTop
ersetze durch
pos = document.documentElement.scrollTop + document.body.offsetHeight - 80;
Und die Zeile
pos = document.body.scrollTop
ersetze durch
pos = document.body.scrollTop + document.body.offsetHeight - 80;
So _müsste_ es klappen, ich kann es im Moment leider nur im Mozilla testen.
Ach ja, und die Zeile mit pos += 30 kannst Du ganz weglassen.
Viele Grüße,
Christian-
Vielen Dank Christian! hat funktioniert :)
-
-
-
-
-
-
hi,
Dich dürften dazu die Eigenschaften window.innerHeight für nicht-IE-Browser und die Eigenschaften document.body.offsetHeight für den IE interessieren.
ich würde das script _ausschliesslich_ für den IE verwenden, und in den browsern die es können, position:fixed vorziehen.
warum sollte man in den anderen auch auf so einen ruckelnden workaround zurückgreifen?
browser die mehr können als der IE zu bestrafen macht doch keinen sinn.gruss,
wahsaga-
Hallo wahsaga,
warum sollte man in den anderen auch auf so einen ruckelnden workaround zurückgreifen?
Wie willst Du den IE *sauber* von anderen Browsern trennen?
Viele Grüße,
Christian-
hi,
Wie willst Du den IE *sauber* von anderen Browsern trennen?
das javascript nur im IE greifen zu lassen, dürfte mit einer kleinen abfrage kein problem darstellen.
position:fixed; kommt ins 'normale' stylesheet - und für den IE wird es mit einem eigenen kleinen <style>-bereich innerhalb von conditional comments wieder durch position:absolute; überschrieben.
ok, nicht _ganz_ sauber, die technik, da kommentare keinerlei vom browser ausgeführte oder interpretierte anweisungen/definitionen enthalten sollten - aber die conditional comments hat MS verbrochen, nicht ich :-)
gruss,
wahsaga -
Hi Christian,
Wie willst Du den IE *sauber* von anderen Browsern trennen?
Mit http://msdn.microsoft.com/workshop/author/dhtml/overview/ccomment_ovw.asp?
Grüße,
Roland--
http://my.opera.com/dev/articles/20030519/
http://aktuell.de.selfhtml.org/tippstricks/beitrag.htm
selfcode = ss:| zu:} ls:} fo:} de:> va:} ch:| sh:) n4:& rl:| br:< js:{ ie:{ fl:{ mo:|-
Hallo Roland,
Mit http://msdn.microsoft.com/workshop/author/dhtml/overview/ccomment_ovw.asp?
Ich hätte »sauber« näher definieren sollen. ;-)
Viele Grüße,
Christian-
hi,
Ich hätte »sauber« näher definieren sollen. ;-)
ja ja, immer das gleiche hier ... die fragesteller drücken sich einfach nicht genau genug aus.
;-)
gruss,
wahsaga
-
-
-
-
-
-
-
-
-
-