Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [PHP][HTML][CSS]Odnośnik do miejsca na stronie
Forum PHP.pl > Forum > Przedszkole
bamboo.niga
9.07.2009, 12:45:36
Hey. Problem uwidoczniony jest tutaj.

Otóż, w PHP zrobiłem coś takiego, że po kliknięciu na link "Czytaj więcej" znajdujący się przy akapicie poświęconym Grupie 3, przeładowuje się ta sama strona, lecz z dłuższym tekstem poświęconym tej grupie. Został wykorzystany odnośnik do miejsca na stronie. Poniżej zamieszczam kody.

Problemem jest to, że tekst o innych grupach zamieszczony powyżej Grupy 3 ginie i jest jakby chowany pod logiem strony. Oczywiście, tak być nie może.

Wiecie jak temu zaradzić?

plik przyklad.php
[PHP] pobierz, plaintext 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  2.  
  3. <html>
  4.     <head>
  5.         <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  6.         <title> Przykład </title>
  7.         <style type="text/css">
  8.             * 
  9.             { 
  10.                 margin: 0;
  11.                 padding: 0; 
  12.             }
  13.             body 
  14.             {
  15.                 color: black;
  16.                 font-size: 10px;
  17.                 margin: 0 auto;
  18.                 padding: 0;
  19.                 text-align: center;
  20.             }
  21.             #calosc
  22.             {
  23.                 width: 900px;
  24.                 margin: 0 auto; 
  25.                 padding: 0;
  26.                 border: 2px solid #BA5503;
  27.                 margin-top: 7px;
  28.                 text-align: left;
  29.                 margin-bottom: 7px;
  30.             }
  31.             #logo
  32.             {
  33.                 width: 900px;
  34.                 height: 150px;
  35.                 background: red;
  36.                 text-align: left;
  37.                 border: 0;
  38.             }
  39.             #menu
  40.             {
  41.                 width: 900px;
  42.                 height: 26px;
  43.                 border-top: 1px solid #BA5503;
  44.                 border-bottom: 1px solid #BA5503;
  45.                 border-right: 0px;
  46.                 border-left: 0px;
  47.             }
  48.             #kontener
  49.             {
  50.                 width: 900px;
  51.                 border: 0;
  52.                 min-height: 600px;
  53.                 overflow: hidden; 
  54.                 position: relative;
  55.             }
  56.             #lewo 
  57.             {
  58.                 width: 150px;
  59.                 border: 0;
  60.                 float: left; 
  61.                 background: gray;
  62.                 height: auto !important;
  63.                 height: 600px; /* IE */
  64.                 min-height: 600px;
  65.                 padding-bottom: 2800px; 
  66.                 margin-bottom: -2800px;
  67.             }
  68.             #srodek 
  69.             {
  70.                 width: 600px;
  71.                 border: 0;
  72.                 float: left;
  73.                 background: #FFF29C;
  74.                 height: auto !important;
  75.                 height: 600px; /* IE */
  76.                 min-height: 600px;
  77.                 padding-bottom: 2800px; 
  78.                 margin-bottom: -2800px;
  79.                 text-align: left;
  80.             }
  81.             #prawo
  82.             {
  83.                 width: 150px;
  84.                 border: 0;
  85.                 float: right;
  86.                 background: gray;
  87.                 height: auto !important;
  88.                 height: 600px; /* IE */
  89.                 min-height: 600px;
  90.                 padding-bottom: 2800px; 
  91.                 margin-bottom: -2800px;
  92.             }
  93.             div.obrazek 
  94.             { 
  95.                 text-align: center; 
  96.                 position: absolute; 
  97.                 bottom: 10px; 
  98.                 width: 150px;     
  99.             }            
  100.             #stopka
  101.             {
  102.                 width: 900px;
  103.                 height: 16px;
  104.                 clear: both;
  105.                 border: 0;
  106.                 background-color: #FFF29C;
  107.                 border-top: 1px solid #BA5503;
  108.             }
  109.             ul.menu
  110.             {
  111.                 position: absolute; /* nie bedzie przesuwany tekst w divach ponizej*/
  112.             }
  113.             ul.menu, ul.menu li 
  114.             {
  115.                 display: block;
  116.                 list-style: none;
  117.                 margin: 0;
  118.                 padding: 0;
  119.             }
  120.             ul.menu li 
  121.             {
  122.                 width: 89px;
  123.                 text-align: center;
  124.                 border-right: solid #BA5503 1px;
  125.                 line-height: 26px;
  126.                 float: left; 
  127.             }
  128.             p.tekst
  129.             {
  130.                 font-family: "Times New Roman";
  131.                 font-size: 17px;
  132.                 color: black;
  133.                 text-align: justify;
  134.                 font-weight: normal;
  135.                 margin-right: 20px;
  136.                 margin-left: 20px;
  137.                 margin-top: 15px;    
  138.             }
  139.         </style>
  140.     </head>
  141.     <body>
  142.         <div id='calosc'>    
  143.             <div id='logo'></div>
  144.             <div id='menu'>
  145.                 <?php
  146.                     echo "<ul class='menu'>";
  147.                     echo "<li style='width: 60px;'>X</li>";
  148.                     echo "<li>A</li>";
  149.                     echo "<li style='width: 119px;'>B</li>";
  150.                     echo "<li>C</li>";
  151.                     echo "<li>D</li>";
  152.                     echo "<li><a href='przyklad.php?odnosnik=6'>Grupy</a></li>";
  153.                     echo "<li>E</li>";
  154.                     echo "<li>F</li>";
  155.                     echo "<li>G</li>";
  156.                     echo "<li style='border: 0'>H</li>";
  157.                     echo "</ul>";
  158.                 ?>
  159.             </div>
  160.             <div id='kontener'>
  161.                 <div id='lewo'>  
  162.                     <div class='obrazek'>     
  163.                         <p class="img">
  164.                         <a href="http://jigsaw.w3.org/css-validator/check/referer">
  165.                         <img style="border:0; width:70px; height:25px" src="http://jigsaw.w3.org/css-validator/images/vcss" alt="Poprawny CSS!">
  166.                         </a>
  167.                         </p>
  168.                     </div>
  169.                 </div>
  170.                 <div id='srodek'>
  171.                 <?php
  172.                     if (isset($_GET['odnosnik']))
  173.                     {
  174.                         switch ($_GET['odnosnik'])
  175.                         {
  176.                             case 6:
  177.                             include("grupy.php");
  178.                             break;            
  179.                         }
  180.                     }    
  181.                     else
  182.                     {
  183.                         echo "<p class='tekst'>Kliknij na Grupy</p>";
  184.                     }
  185.                 ?> 
  186.                 </div>
  187.                 <div id='prawo'></div>
  188.             </div>
  189.             <div id='stopka'>
  190.                 <p class="stopka">Copyright 2009</p>
  191.             </div>
  192.         </div>    
  193.     </body>
  194. </html>
[PHP] pobierz, plaintext


plik grupy.php
[PHP] pobierz, plaintext 
  1. <p> </p>
  2.  
  3. <p class="tekst"><span style="color: #207CC9"><b>Grupy</b></span></p>
  4.  
  5. <hr class="kreska">
  6.  
  7. <p class="tekst"><b>Grupa 1</b></p>    
  8. <p class="tekst"> Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1 Tekst o grupie 1</p>
  9.  
  10. <p class="tekst"><b>Grupa 2</b></p>    
  11. <p class="tekst"> Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2 Tekst o grupie 2</p>
  12.  
  13.  
  14.  
  15.  
  16. <a id='tutaj'></a>
  17. <p class="tekst"><b>Grupa 3</b></p>
  18. <?php
  19.     if (isset($_GET['rozwin']) && ($_GET['rozwin'] == 'grupa3'))
  20.     {
  21.         echo "<p class='tekst'>Kontunuacja krótkiego tekstu o grupie 3, co w efekcie daje długi tekst o grupie 3  o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3 o grupie 3.</p>";
  22.     }
  23.     else
  24.     {
  25.         echo "<p class='tekst'>Krótki tekst o grupi 3 ...
  26.         <a href='przyklad.php?odnosnik=6&rozwin=grupa3#tutaj' class='rozwin'>Czytaj więcej...</a></p>";
  27.     }
  28. ?>
  29.  
  30. <p> </p>
  31.  
  32. <p> </p>
[PHP] pobierz, plaintext
erix
9.07.2009, 15:09:56
Cytat
Problemem jest to, że tekst o innych grupach zamieszczony powyżej Grupy 3 ginie i jest jakby chowany pod logiem strony. Oczywiście, tak być nie może.

Wszystko działa?
bamboo.niga
9.07.2009, 15:44:00
Cytat
Wszystko działa?


Nie rozumiem... Działa niepoprawnie. Tekst powyżej nie może ginąć!
1oBuZ
9.07.2009, 15:47:43
Czy chodzi CI o to aby ten (Krótki tekst o grupi 3 ... Czytaj więcej...) fragment tekstu Ci nie znikał?:
erix
9.07.2009, 16:15:14
Nie rozumiem, chcesz przykleić topik strony, aby był cały czas widoczny niezależnie od przewijania...?
bamboo.niga
9.07.2009, 18:18:47
Chciałbym uzyskać taki efekt.

Czyli po przeładowaniu jest przekierowanie i widać od razu akapit 3, a tekst ponad nim nie ginie.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.