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:

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

Posty w temacie


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

 



RSS Aktualny czas: 22.08.2025 - 19:24