Re[3]: Как сделать страничку с непрокручиваемым заголовком
От: uzzy Россия  
Дата: 03.09.03 09:34
Оценка: :)
Здравствуйте, mogadanez, Вы писали:

M>Здравствуйте, mogadanez, Вы писали:

M>>Здравствуйте, cfork, Вы писали:

C>>>т.е. чтобы заголовок вне зависимости от положения скроллера всегда находился вверху странички. Например, так, как сделано в MSDN

C>>>Заранее спасибо

M>>фреймы


M>или весь контент запихать в <Div style="overflow:scroll" height="<высота окна — высота заголовка>"
немного продолжая идею:
<html>
   <head>
      <meta name=vs_defaultClientScript content="JavaScript">
      <meta name=vs_targetSchema content="HTML 4.0">
      <script language="javascript" type="text/javascript">
         doClick = function ()
         {
            obj = document.getElementById ("contentDIV");
            pobj = document.createElement ("P");
            pobj.appendChild (document.createTextNode ("sad"));
            obj.appendChild (pobj);
         }
      </script>
   </head>
<body>
  <table>
    <tr id="headerTR">
      <td id="headerTD">
        <div style="width:100%;overflow:visible" id="headerDIV">
          <!-- header -->
          <p>Header</p>
        </div>
      </td>
    </tr>
    <tr id="contentTR">
      <td id="contentTD">
        <div style="width:800;height:500;overflow:auto;" id="contentDIV">
          <!-- content -->
          <button onclick="doClick();">Add "sad"</button>
        </div>
      </td>
    </tr>
  </table>
</body>
</html>
... << RSDN@Home 1.1 beta 1 >>
Как сделать страничку с непрокручиваемым заголовком
От: cfork  
Дата: 03.09.03 08:38
Оценка:
т.е. чтобы заголовок вне зависимости от положения скроллера всегда находился вверху странички. Например, так, как сделано в MSDN

Заранее спасибо
Re: Как сделать страничку с непрокручиваемым заголовком
От: King Oleg Украина http://kingoleg.livejournal.com
Дата: 03.09.03 08:49
Оценка:
Здравствуйте, cfork, Вы писали:

C>т.е. чтобы заголовок вне зависимости от положения скроллера всегда находился вверху странички. Например, так, как сделано в MSDN

в MSDN сделано с помощью frame'ов
... << RSDN@Home 1.1 beta 1 >>
King Oleg
*Читайте DOC'и, они rules*
Re: Как сделать страничку с непрокручиваемым заголовком
От: DSD Россия http://911.ru/cv
Дата: 03.09.03 08:54
Оценка:
Здравствуйте, cfork, Вы писали:

C>т.е. чтобы заголовок вне зависимости от положения скроллера всегда находился вверху странички. Например, так, как сделано в MSDN

Например фреймами, как это сделано в RSDN.
--
DSD
Re: Как сделать страничку с непрокручиваемым заголовком
От: mogadanez Чехия  
Дата: 03.09.03 08:55
Оценка:
Здравствуйте, cfork, Вы писали:

C>т.е. чтобы заголовок вне зависимости от положения скроллера всегда находился вверху странички. Например, так, как сделано в MSDN

C>Заранее спасибо

фреймы
... << RSDN@Home 1.0 beta 7a >>
Re[2]: Как сделать страничку с непрокручиваемым заголовком
От: mogadanez Чехия  
Дата: 03.09.03 08:58
Оценка:
Здравствуйте, mogadanez, Вы писали:

M>Здравствуйте, cfork, Вы писали:

C>>т.е. чтобы заголовок вне зависимости от положения скроллера всегда находился вверху странички. Например, так, как сделано в MSDN

C>>Заранее спасибо

M>фреймы


или весь контент запихать в <Div style="overflow:scroll" height="<высота окна — высота заголовка>"
... << RSDN@Home 1.0 beta 7a >>
Re[4]: Как сделать страничку с непрокручиваемым заголовком
От: ЖуК Украина http://smart-ip.net/
Дата: 03.09.03 09:51
Оценка:
Здравствуйте, uzzy, Вы писали:

Ага... Только надо задавать у дива размеры жестко — иначе будет глючить. С другой стороны задашь жестко — тоже будет глючить.

А вот так уже не сильно будет глючить... 

<script language="JavaScript" type="text/javascript">
    var cWidth = document.body.clientWidth;
    var cHeight = document.body.clientHeight;
    document.write( '<div id="cDiv" style="padding-left:10px;width:' + ( cWidth - 250) + ';height:' + ( cHeight - 82) + ';overflow:auto">');
</script>
<?php echo $this->getSpaceContent('htdocs'); ?>
</div>
<script language="JavaScript" type="text/javascript">
    window.onresize = function() {
        var cWidth = document.body.clientWidth;
        var cHeight = document.body.clientHeight;
        var cDiv = document.getElementById( "cDiv");
        cDiv.style.width = cWidth - 200;
        cDiv.style.height = cHeight - 82;
    }
</script>



Эт код так для примеру — выдрал из своего проекта, так что не обращайте внимание на всякие там ПХП.
_____________________________________________________________
"Голова — кость, поэтому болеть не может..." © Неизвестный автор
Re[4]: Как сделать страничку с непрокручиваемым заголовком
От: mogadanez Чехия  
Дата: 03.09.03 09:57
Оценка:
Здравствуйте, uzzy, Вы писали:


угу, плюс добавить ресайз дива при ресайзе окна... =) и будет ОК!
... << RSDN@Home 1.0 beta 7a >>
Re: Как сделать страничку с непрокручиваемым заголовком
От: DimRus Украина  
Дата: 03.09.03 11:27
Оценка:
Здравствуйте, cfork, Вы писали:

C>т.е. чтобы заголовок вне зависимости от положения скроллера всегда находился вверху странички. Например, так, как сделано в MSDN

C>Заранее спасибо

Есть две идеи (обе опробовал).
1. Таблицы (без скриптов):
<html>
<head>
<title>Test Moving</title>
</head>
<body  topmargin="0" leftmargin="0" style="overflow: hidden">
<table width="100%" height="100%" cellpadding="0" cellspacing="0" style="padding: 0px;">
   <tr> 
      <td height="45" valign="middle" bgcolor="Teal" style="border: ridge; border-width: thin 0px thin 0px;"> 
         <div style="height: 100%; overflow: hidden;"> 
            <h2 style="padding: 0px;"> Название 
               раздела </h2>
         </div>
      </td>
   </tr>
   <tr> 
      <td valign="top" style="padding: 0px;"> 
         <div style="height: 100%; width: 100%; overflow: scroll;">
          test<br>test<br>test<br>test<br>test<br>test<br>test<br>test<br>test<br>
          test<br>test<br>test<br>test<br>test<br>test<br>test</div>
      </td>
   </tr>
</table>
</body>
</html>


2. Скрипты (без таблиц ):
<html>
<head>
<title>Test moving</title>
<style type="text/css">
<!--
body {text-align: justify;text-indent: 0.5cm;margin: 0px;padding: 0px;}
h1 { text-align: center; text-indent: 0cm;}
.header {font-size: 10pt;text-align: left;text-indent: 0px;vertical-align: top;margin: 0px;padding: 0px;}
div.header {overflow: visible;background-color: Teal;height: 50pt;width: 100%;border: ridge; border-width: thin 0px thin 0px;}
td.header {vertical-align: top;}
.content {overflow: scroll; width: 100%; height: 80%; margin: 0px; padding: 0px;}
-->
</style>
</head>
<script language="JavaScript" type="text/JavaScript">
<!--
var cntBl = null;
var hdrBl = null;

function contentResized()
{
 cntBl.style.pixelHeight = document.body.offsetHeight - hdrBl.offsetHeight;
}
function initResize()
{
      cntBl = document.all("contentBlock");
      hdrBl = document.all("headerBlock");
      if(cntBl!=null){
                if(hdrBl!=null){
                window.onresize = contentResized;
                contentResized();
                }
      }
}

//-->
</script>
<body  scroll=no onclick="rollbackMenu(document.body);">
<div class="header" id="headerBlock"> 
   <table class="header" width="100%" border="0" cellpadding="0" cellspacing="0">
      <tr><td valign="top"> <h1>Название&nbsp;раздела - неподвижная часть</h1></td></tr>
   </table>
</div>
<div id="contentBlock" class="content"> 
   <p>Содержание раздела - подвижная часть</p>
   <p>тест<br>тест<br>тест<br>тест<br>тест<br>тест<br>тест<br>тест<br>тест<br>
    тест<br>тест<br>тест<br>тест<br>тест<br>тест<br>тест<br>тест<br>тест<br>тест</p>
</div>
<script>
   initResize();
</script>
</body>
</html>
 
Подождите ...
Wait...
Пока на собственное сообщение не было ответов, его можно удалить.