hallo, ich habe eben ein script gefunden, welches eine verstecktes fenster öffnet, in dem einige bider zu sehen sind. eigentlich könnte man dies auch mit css bewerkstellingen, nur hätte man dann nicht diese slide effekt. genau dieser macht mir etwas zu schaffen. ich würde eigentlich gern, dass die box nach oben slidet, statt nach unten. außerdem kann ich nicht die <div> box nicht verschieben. obwohl ich im css die angaben für top und left angegeben hatte:
Alles anzeigen
Quellcode
- <style type="text/css">
- /* the box on top of the box we wish to show - this one hide the second one
- we set the height as 0.1 to avoid an IE bug when the height is 0.
- */
- #coverlogin{
- top: 400px;
- left:200px;
- width: 220px;
- height: 220px;
- overflow:hidden;
- visibility: hidden;
- border:1px;
- }
- #loginbox{
- top: 400px;
- left:200px;
- width: 220px;
- height: 220px;
- border: 1px;
- }
- </style>
- <script type="text/javascript">
- var hh=0;
- var inter;
- //we show the box by setting the visibility of the element and incrementing the height smoothly
- function ShowBox()
- {
- //Depending on the amount of text, set the maximum height here in pixels
- if(hh==220)
- {
- clearInterval(inter);
- return;
- }
- obj = document.getElementById("coverlogin");
- obj.style.visibility = 'visible';
- hh+=2;
- obj.style.height = hh + 'px';
- }
- //same way as above but reversed
- function HideBox()
- {
- obj = document.getElementById("coverlogin");
- if(hh==2)
- {
- obj.style.visibility = 'hidden';
- obj.style.height = '220px';
- clearInterval(inter);
- return;
- }
- hh-=2;
- obj.style.height = hh + 'px';
- }
- </script>
- </head>
- <body>
- <!-- set an interval for the increment of the height by clicking onto this link -->
- <a href="#" onClick="inter=setInterval('ShowBox()',3);return false;">Click here to show the box</a>
- <div id="coverlogin">
- <div id="loginbox">
- <table width="220" border="0">
- <tr>
- <td width="100"><img src="bilder/Bild001.jpg" width="100" alt="bild"></td>
- <td width="20"></td>
- <td width="100"><img src="bilder/Bild002.jpg" width="100" alt="bild"></td>
- </tr>
- <tr>
- <td height="20"></td>
- <td><a href="#" onClick="inter=setInterval('HideBox()',3);return false;">X</a></td>
- <td></td>
- </tr>
- <tr>
- <td width="100"><img src="bilder/Bild003.jpg" width="100" alt="bild"></td>
- <td></td>
- <td width="100"><img src="bilder/Bild004.jpg" width="100" alt="bild"></td>
- </tr>
- </table>
- </div>
- </div>