Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [PHP] Przewinięcie div-a w dół wzglendem osi Y.
Forum PHP.pl > Forum > PHP
koxfx
20.06.2015, 13:16:03
Mam taki kod.
[PHP] pobierz, plaintext 
  1. <?php 
  2.  
  3.  $adres_ip_serwera_mysql_z_baza_danych = '127.0.0.1';
  4.  
  5.  $nazwa_bazy_danych = 'czat';
  6.  
  7.  $login_bazy_danych = 'root';
  8.  
  9.  $haslo_bazy_danych = '';
  10.  
  11.  
  12.  if ( !mysql_connect($adres_ip_serwera_mysql_z_baza_danych,
  13.  
  14.               $login_bazy_danych,$haslo_bazy_danych) ) {
  15.     echo 'Nie moge polaczyc sie z baza danych';
  16.  	 exit (0);
  17.  }
  18.  if ( !mysql_select_db($nazwa_bazy_danych) ) {
  19.     echo 'Blad otwarcia bazy danych';
  20.  	 exit (0);
  21.  }
  22.  
  23.  $zapytanie = "SELECT * FROM `czat`";
  24.  $wynik = mysql_query($zapytanie);
  25.  
  26.  
  27.  echo "<div id=xxx; style=width:60%;height:300px;margin:auto;overflow-y:auto;>";
  28.  echo "<table boder=\"1\"><tr>";
  29.  echo "<td bgcolor=\"9EBEFF\"><strong>Nick</strong></td>";
  30.  echo "<td bgcolor=\"7BD594\"><strong>Post</strong></td>";
  31.  echo "</tr>";
  32.  
  33.  
  34.  while ( $row = mysql_fetch_row($wynik) ) {
  35.     echo "</tr>";
  36.     echo "<td bgcolor=\"7BD594\">" . $row[0] . "&nbsp&nbsp&nbsp&nbsp</td>";
  37.     echo "<td bgcolor=\"9EBEFF\">" . $row[1] . "</td>";
  38.     echo "</tr>";
  39.  }
  40.  echo "</table>";
  41.  echo "</div>";
  42.  
  43.  if ( !mysql_close() ) {
  44.     echo 'Nie moge zakonczyc polaczenia z baza danych';
  45.     exit (0);
  46.  }
  47.  
  48.  ?>
[PHP] pobierz, plaintext


Wyświetla on zawartość tabeli mysql w div. Jest tylko jeden problem nie wiem jak zrobić aby div był zawsze przewinięty w dół względem osi Y.

kapslokk
20.06.2015, 13:27:07
Dodaj sobie JavaScript, który po załadowaniu treści przesunie Ci scrolla w dół:

[HTML] pobierz, plaintext 
  1. <script type="text/javascript">
  2.   var elem = document.getElementById('xxx');
  3.   elem.scrollTop = elem.scrollHeight;
  4. </script>
[HTML] pobierz, plaintext
koxfx
20.06.2015, 14:08:38
kapslokk próbowałem tego nawet wcześniej tylko ten kod nie chce działać.
Pod strone mam podpięty Bootstrap v3.3.5
kapslokk
20.06.2015, 14:14:32
Zrobiłem na szybko htmla i wszystko jest ok. Wypluwa Ci jakieś błędy konsola JS?

[HTML] pobierz, plaintext 
  1. <html>
  2. 	<body>
  3. 		<div id="xxx" style="width:60%;height:300px;margin:auto;overflow-y:auto;">
  4. 			<table>
  5. 				<tr>
  6. 					<td>Lorem ipsum</td>
  7. 					<td> Dolor sit amet</td>
  8. 				</tr>
  9. 					<tr>
  10. 					<td>Lorem ipsum</td>
  11. 					<td> Dolor sit amet</td>
  12. 				</tr>
  13. 				<tr>
  14. 					<td>Lorem ipsum</td>
  15. 					<td> Dolor sit amet</td>
  16. 				</tr>
  17. 				<tr>
  18. 					<td>Lorem ipsum</td>
  19. 					<td> Dolor sit amet</td>
  20. 				</tr>
  21. 				<tr>
  22. 					<td>Lorem ipsum</td>
  23. 					<td> Dolor sit amet</td>
  24. 				</tr>
  25. 				<tr>
  26. 					<td>Lorem ipsum</td>
  27. 					<td> Dolor sit amet</td>
  28. 				</tr>
  29. 				<tr>
  30. 					<td>Lorem ipsum</td>
  31. 					<td> Dolor sit amet</td>
  32. 				</tr>
  33. 				<tr>
  34. 					<td>Lorem ipsum</td>
  35. 					<td> Dolor sit amet</td>
  36. 				</tr>
  37. 				<tr>
  38. 					<td>Lorem ipsum</td>
  39. 					<td> Dolor sit amet</td>
  40. 				</tr>
  41. 				<tr>
  42. 					<td>Lorem ipsum</td>
  43. 					<td> Dolor sit amet</td>
  44. 				</tr>
  45. 				<tr>
  46. 					<td>Lorem ipsum</td>
  47. 					<td> Dolor sit amet</td>
  48. 				</tr>
  49. 				<tr>
  50. 					<td>Lorem ipsum</td>
  51. 					<td> Dolor sit amet</td>
  52. 				</tr>
  53. 				<tr>
  54. 					<td>Lorem ipsum</td>
  55. 					<td> Dolor sit amet</td>
  56. 				</tr>
  57. 				<tr>
  58. 					<td>Lorem ipsum</td>
  59. 					<td> Dolor sit amet</td>
  60. 				</tr>
  61. 			</table>
  62. 		</div>
  63. 		    <script type="text/javascript">
  64. 				var elem = document.getElementById('xxx');
  65. 				elem.scrollTop = elem.scrollHeight;
  66. 			</script>
  67. 	</body>
  68. </html>
[HTML] pobierz, plaintext
koxfx
20.06.2015, 14:20:18
A jest błąd odnośnie jquery

if (typeof jQuery === 'undefined') {
throw new Error('Bootstrap\'s JavaScript requires jQuery')
}
Dodałem biblioteke i nie widzę błędów.
kapslokk
20.06.2015, 14:23:56
W takim razie dodaj sobie:
[HTML] pobierz, plaintext 
  1. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
[HTML] pobierz, plaintext

przed JavaScriptami Bootstrapa.

@edit
Nie widzisz błędów, a przesuwanie na dół działa?
koxfx
20.06.2015, 14:28:19
Tylko jest taki problem że kod dalej nie chce działać. Jquery zostało dodane do strony.
kapslokk
20.06.2015, 14:32:51
Możesz wrzucić wygenerowanego przez skrypt HTML'a? Myślę, że wtedy będzie nam łatwiej znaleźć problem smile.gif
kapslokk
20.06.2015, 15:19:20
W mojej ostatniej wypowiedzi chodzi o gotowy już kod html, czyli odpalasz sobie skrypt, CTRL+U, kopiujesz wszystko i wklejasz nam tutaj.
kafowi
20.06.2015, 15:43:15
Cytat(koxfx @ 20.06.2015, 16:29:28 ) *
<div id=xxx; style=width:60%;height:300px;margin:auto;overflow-y:auto;>

Panie, popraw to bo to oczy aż bolą.
kapslokk
20.06.2015, 15:44:39
Ogólnie to masz bardzo dużo błędów w HTML'u. Na przykład niedomknięte znaczniki, atrybut rows dla inputa, atrybuty dla elementów wrzucone bez " i ze średnikami na końcu ( <div id=xxx; style...> ), poza tym HTML5 i bgcolor="7BD594" smile.gif.

Przepuść sobie swoja stronę przez walidator, popraw błędy i zacznie wszystko działać jak należy smile.gif
koxfx
20.06.2015, 17:00:43
Teraz wszystko działa, poprawiłem błędy.
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.