Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> html/JS div - scroll, problem z uciekającym scrollem i wysokością diva
ruzam
post
Post #1





Grupa: Zarejestrowani
Postów: 4
Pomógł: 0
Dołączył: 15.10.2010

Ostrzeżenie: (0%)
-----

Witam wszystkich forumowiczów !

Mam poważny problem z okiełznaniem pewnego zadania. Mianowicie po zmniejszeniu okna przeglądarki internetowej scroll dolnego diva "ucieka po za ekran" a po odświeżeniu strony w tym małym rozmiarze scroll nabiera rozmiarów okna. Drugi zaś problem to ramka na górze (fioletowa), po dodaniu jakiejkolwiek zawartości do niej, ramka wchodzi na tego diva na dole. Czy mógłby mi ktoś przerobić ten kod żeby to działało tak jak ma być ? Proszę bardzo o pomoc.
Podaje kod:

[HTML] pobierz, plaintext 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
  2. <html>
  3.     <head>
  4.         <title></title>
  5.  
  6.         <script language="javascript">
  7.             function GetHeight() {
  8.                 var y = 0;
  9.                 if (self.innerHeight) {
  10.                     y = self.innerHeight;
  11.                 }
  12.                 else if (document.documentElement && document.documentElement.clientHeight) {
  13.                     y = document.documentElement.clientHeight;
  14.                 }
  15.                 else if (document.body) {
  16.                     y = document.body.clientHeight;
  17.                 }
  18.                 return y;
  19.             }
  20.  
  21.             function Loaded() {
  22.                 // alert("loaded");
  23.                 var oHeaderPanel = document.getElementById("headerPanel");
  24.                 var oPanel = document.getElementById("bodyPanel");
  25.                 if (oPanel == null ||
  26.                     oHeaderPanel == null) {
  27.                     alert(oPanel == null);
  28.                     alert(oHeaderPanel == null);
  29.                     return;
  30.                 }
  31.  
  32.                 var iNewHeight = GetHeight() - 200;
  33.                 oPanel.setAttribute("style", oPanel.getAttribute("style") + "; height:" + iNewHeight + "px;");
  34.             }
  35.  
  36.         </script>
  37.  
  38.         <style type="text/css">
  39.             body
  40.             {
  41.                 color: black;
  42.                 background-color: #FFFFFF;
  43.             }
  44.             .attachmentList
  45.             {
  46.                 float:left;
  47.                 list-style-type:none;
  48.                 padding: 0;
  49.                 margin: 0;
  50.             }
  51.             .attachmentListItem
  52.             {
  53.                 float:left;
  54.                 margin-right:10px;
  55.             }
  56.  
  57.             .headerTable
  58.             {
  59.                 width: 99%;
  60.                 border-collapse:collapse;
  61.                 background-color: #D0D0FF;
  62.                 position: fixed;
  63.             }
  64.             td
  65.             {
  66.                 border: solid 1px black;
  67.             }
  68.             .headerConstFields
  69.             {
  70.                 width: 160px;
  71.             }
  72.         </style>
  73.     </head>
  74.     <body onload="Loaded();">
  75.     <div id="headerPanel">
  76.         <table class="headerTable">
  77.             <tr>
  78.                 <td class="headerConstFields">From:</td>
  79.                 <td>%from%</td>
  80.             </tr>
  81.             <tr>
  82.                 <td class="headerConstFields">To:</td>
  83.                 <td>%to%</td>
  84.             </tr>
  85.             <tr>
  86.                 <td class="headerConstFields">CC:</td>
  87.                 <td>%cc%</td>
  88.             </tr>
  89.             <tr>
  90.                 <td class="headerConstFields">BCC:</td>
  91.                 <td>%bcc%</td>
  92.             </tr>
  93.             <tr>
  94.                 <td class="headerConstFields">Date:</td>
  95.                 <td>%date%</td>
  96.             </tr>
  97.             <tr>
  98.                 <td class="headerConstFields">Title:</td>
  99.                 <td>%title%</td>
  100.             </tr>
  101.             <tr>
  102.                 <td class="headerConstFields">Attachments:</td>
  103.                 <td>%attachmentList%</td>
  104.             </tr>
  105.         </table>
  106.         </div>
  107.  
  108.         <div id="bodyPanel" style="position:fixed;top:220px; width:99%; height:80%; overflow:scroll;">
  109. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  110. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  111. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  112. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  113. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  114. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  115. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  116. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  117. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  118. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  119. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  120. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  121. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  122. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  123. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  124. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  125. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  126. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  127. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  128. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  129. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  130. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  131. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  132. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  133. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  134. <br>dasgjajjjjjjjjjjjjjjjjjjjjjjjjjjjj</br>
  135.             <div>%body%</div>
  136.             <br />
  137.             <div style="background:#F0F0B0;">%attachments%</div>
  138.         </div>
  139.     </body>
  140. </html>
[HTML] pobierz, plaintext
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi
erix
post
Post #2





Grupa: Moderatorzy
Postów: 15 467
Pomógł: 1451
Dołączył: 25.04.2005
Skąd: Szczebrzeszyn/Rzeszów
Temat: JavaScript jesli Twoj watek go dotyczy KONIECZNIE przeczytaj
Go to the top of the page
+Quote Post

Posty w temacie
- ruzam   html/JS div - scroll   15.10.2010, 08:37:01
- - wookieb   Dopisz [JAVASCRIPT] pobierz, plaintext window.onre...   15.10.2010, 10:43:39
- - ruzam   Czy mógłbyś mi napisać gdzie co dopisać i co wykas...   15.10.2010, 10:53:20
- - wookieb   Ta wyjechał. Nie bo Ci nie wierzę po prost. Szukas...   15.10.2010, 11:08:51
- - ruzam   Nie chcesz nie wierz. Dla Ciebie to pewnie minuta...   15.10.2010, 11:13:12
- - erix   Temat: JavaScript jesli Twoj watek go dotyczy KONI...   15.10.2010, 14:16:11
- - ruzam   Cały ten problem już rozwiązałem i dziękuję bardzo...   18.10.2010, 09:56:54

« Następny starszy · JavaScript · Następny nowszy »
 

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Przełącz na: Standardowy · Przełącz na: Linearny+ · Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 7.10.2025 - 17:03
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn