• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

div am rand mitlaufen lassen ? wie?

Status
Für weitere Antworten geschlossen.

web673

Neues Mitglied
Hi

ich würde gerne wissen wie ich diesen effekt binbekomme der auf der seite :
http://www.rss.game.tw/aion/
ist.

da ist rechts und links eine figur die mitläuft. wie geht das ?

wenn wer das weiß kann er den code posten?

grüße

p.s. ich möchte das halt anders lösen. weil das rechte bild wird nicht automatisch mitverschoben wenn ich das bild größer mache.

geht das auch nur mit html und css ?

grüße
 
Zuletzt bearbeitet:
Auf dieser Seite wurde das mit einem div gemacht, in dem eine Grafik steckt und per Javascript in die Mitte des Bildes verschoben wird. Unten steht verwendete der Code, wie das mit dem Copyright aussieht, kann ich dir nicht sagen, kann kein Chinesisch.

Wenn du keine anderen Hintergrundbilder auf der seite hast, wäre es einfacher, das mit
HTML:
background-attachment:fixed
zu machen.
Code:
<!-- 2//===================
 3// 對聯廣告效果腳本
 4// by 木鳥 2007.11.14
 5// www.iwms.net
 6// 轉載及使用請保留本信息
 7//===================
 8var m_layer1,m_layer2;
 9function initMove() {
10 m_layer1=document.getElementById("AdLayer1");
11 m_layer2=document.getElementById("AdLayer2");
12 m_layer1.style.top = "-200px";
13 m_layer1.style.visibility = 'visible'
14 m_layer2.style.top = "-200px";
15 m_layer2.style.visibility = 'visible'
16 MoveLayers();
17 window.onscroll=MoveLayers;
18}
19function MoveLayers() {
20 var x = 5; // 左右邊距
21 var y = 300; // 頂距
22 var st=document.documentElement.scrollTop;
23 var cw=document.documentElement.clientWidth;
24 var y = st + y;
25 m_layer1.style.top = y+"px";
26 m_layer1.style.left = x+"px";
27 m_layer2.style.top = y+"px";
28 m_layer2.style.left = cw-m_layer2.clientWidth-x+"px";
29}
30window.setTimeout("initMove()",600);
31// -->
PHP:
<div id="AdLayer1" style="z-index: 1; visibility: visible; position: absolute; top: 414px; left: 5px;">
  <a target="_blank" href="http://www.yen-denttech.com.tw/">
    <img height="210" border="0" width="120" alt="" src="../pic/rg.png"/>
  </a>
</div>
<div id="AdLayer2" style="z-index: 1; visibility: visible; position: absolute; top: 585px; left: 1298px;">
  <a target="new" href="http://mce_host/aion/msnim:[email protected]"></a>
</div>
 
das ist ien bisschen sehr kompliziert und hackt zudem (ist mir gerade aufgefallen).

ich versuche das gerade mit zwei divs und position:fixed; und fload:left; und right nur irgendwie geht das nicht.. die stehen dann übereinander aber an die richtige position bekomme ich die irgendwie nicht

wie mach ich das... sry für die blöde frage

grüße

p.s. ich habe das so versucht:

Code:
<div style="float: left;">
<div style="position: fixed;"><img src="images/rg.png"	alt="bild" border="0" height="210" width="120"></div>
</div>

<div style="float: right;">
<div style="position: fixed;"><img src="images/lg.png" alt="bild" border="0" height="255" width="120"></div>
</div>
grüße
 
Du brauchst nicht floaten, gib den div's einfach noch top und left (right), dann funktioniert es. Top 50%, dann sind sie immer schön in der Mitte.

PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
 "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
  <head>
    <title>Test</title>
    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
    <style type="text/css">
      .left {
        position: fixed;
        left: 0;
        top: 50%;
      }
      
      .right {
        position: fixed;
        right: 0;
        top: 50%;
      }
    </style>
  </head>
  <body>
    <div class="left">Muh</div>
    <div class="right">Muh</div>
  </body>
</html>
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben