Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [JavaScript] poruszenie obrazu, Timer działa ale nie wiem jak poruszyć obraz
simman
post 2.11.2010, 14:51:59
Post #1





Grupa: Zarejestrowani
Postów: 21
Pomógł: 0
Dołączył: 23.05.2007

Ostrzeżenie: (10%)
X----

Cześć!
Mam problem chce zmienić wielkość i pozycje mojego image pilka.jpg wykorzystując Timer.

Timer działa jeśli z kodu pozbędziemy się tego smile.gif Jednak ja chce wykonać działania na image smile.gif

<img src="pilka.jpg" name ="cos"/>
document.getElementByName('cos').style.height=c;


Mój cały kod
[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html>
  2. <head>
  3.   <meta http-equiv="Content-type" content="text/html; charset=iso-8859-2">
  4.   <meta name="Description" content=" [wstaw tu opis strony] ">
  5.   <meta name="Keywords" content=" [wstaw tu slowa kluczowe] ">
  6.   <meta name="Author" content=" [dane autora] ">
  7.   <meta name="Generator" content="kED2">
  8.  
  9.   <title> [tytuł strony] </title>
  10.  
  11.   <link rel="stylesheet" href=" [nazwa_arkusza_stylow.css] " type="text/css">
  12. </head>
  13. <body onload ="doTimer()"> 
  14. <script language ="javascript" type "text/javascript">
  15.  
  16. var c=0;
  17. var t;
  18. var timer_is_on=0;
  19.  
  20. function timedCount()
  21. {
  22. c=c+1;
  23.  
  24. document.getElementById('wooYayMessage').innerHTML= c.toString();
  25. document.getElementByName('cos').style.height=c;
  26. t=setTimeout("timedCount()",1000);
  27. }
  28.  
  29. function doTimer()
  30. {
  31. if (!timer_is_on)
  32.   {
  33.   timer_is_on=1;
  34.   timedCount();
  35.   }
  36. }
  37.  
  38.  
  39. </script>
  40. <div id ="wooYayMessage" style="height: 1.5em font-size: 2em; color:red">
  41.  
  42. </div>
  43. <img src="pilka.jpg"  name ="cos"/>
  44. </body>
  45. </html>
[HTML] pobierz, plaintext
Go to the top of the page
+Quote Post
kamil4u
post 2.11.2010, 18:02:47
Post #2





Grupa: Zarejestrowani
Postów: 2 350
Pomógł: 512
Dołączył: 4.01.2009
Skąd: Wrocław / Świdnica

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

Nie wiem o co Ci chodzi, ale nie ma czegoś takiego jak getElementByName jest getElementsByName ,ale funkcja ta zwraca tablicę. Czyli jeżeli masz element jako pierwszy w elemencie to:
document.getElementsByName('cos')[0].style.height=c;
Jeżeli tych elementów jest więcej to musisz użyć pętlę.

Używaj konsoli błędów to pozbędziesz się większości(jak nie wszystkie) literówek


--------------------
>>> iPage.pl - JS, HTML5, CSS3, Android - moja oferta
>>> myPrzepis.pl - blog kulinarny
Go to the top of the page
+Quote Post
simman
post 3.11.2010, 10:12:20
Post #3





Grupa: Zarejestrowani
Postów: 21
Pomógł: 0
Dołączył: 23.05.2007

Ostrzeżenie: (10%)
X----

Słuchaj zrobiłem tak jak mówisz i rzeczywiście Timer działa smile.gif ale nie zmienia się wielkość obrazka DLACZEGO? konsola błędów jak włączyć?

Ten post edytował simman 3.11.2010, 10:13:34
Go to the top of the page
+Quote Post
konrados
post 3.11.2010, 10:45:33
Post #4





Grupa: Zarejestrowani
Postów: 623
Pomógł: 79
Dołączył: 16.01.2008

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

Firefox -> narzędzia -> konsola błędów.

W IE klawisz F12

Poza tym ściągnij se firebuga (dodatek do firefoxa).

Ten post edytował konrados 3.11.2010, 10:46:06
Go to the top of the page
+Quote Post
simman
post 3.11.2010, 11:17:51
Post #5





Grupa: Zarejestrowani
Postów: 21
Pomógł: 0
Dołączył: 23.05.2007

Ostrzeżenie: (10%)
X----

Okej dzięki a dlaczego ten obrazek nie zmienia wielkości jak wszystko wygląda że jest już dobrze
Go to the top of the page
+Quote Post
zegarek84
post 3.11.2010, 11:30:48
Post #6





Grupa: Zarejestrowani
Postów: 1 332
Pomógł: 294
Dołączył: 12.10.2008
Skąd: Olkusz

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

wysokosć musi mieć określoną jednostkę - albo procentową względem oryginału albo w pikselach -> czyli dla 15 np 15px...


--------------------
Jeśli twoja ręka rusza do przodu powstrzymaj swój gniew; gdy wyprzedza cię twój gniew - wycofaj rękę.
Go to the top of the page
+Quote Post
simman
post 3.11.2010, 12:09:59
Post #7





Grupa: Zarejestrowani
Postów: 21
Pomógł: 0
Dołączył: 23.05.2007

Ostrzeżenie: (10%)
X----

Cytat(zegarek84 @ 3.11.2010, 11:30:48 ) *
wysokosć musi mieć określoną jednostkę - albo procentową względem oryginału albo w pikselach -> czyli dla 15 np 15px...


zrobiłem tak dla przykładu
document.getElementsByName('cos')[0].width="60%";

obrazek się nie pokazuje wtedy

jednak błąd
oczekiwano końca wartości, ale odnaleziono 'font-size' błąd przetwarzania wartości 'hight' deklaracja opuszczona

Co mam zrobić? by działało?

Ten post edytował simman 3.11.2010, 12:12:37
Go to the top of the page
+Quote Post
kamil4u
post 3.11.2010, 22:18:45
Post #8





Grupa: Zarejestrowani
Postów: 2 350
Pomógł: 512
Dołączył: 4.01.2009
Skąd: Wrocław / Świdnica

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

Pokaż swój kod w obecnej formie. Lepiej jak będziesz operował CSS(el.style.własność) niż HTML(el.własność). Zobacz czy nigdzie nie brakuje Ci ";". Zarówno w CSS jak i w JS.


--------------------
>>> iPage.pl - JS, HTML5, CSS3, Android - moja oferta
>>> myPrzepis.pl - blog kulinarny
Go to the top of the page
+Quote Post
simman
post 4.11.2010, 09:19:46
Post #9





Grupa: Zarejestrowani
Postów: 21
Pomógł: 0
Dołączył: 23.05.2007

Ostrzeżenie: (10%)
X----

Cytat(kamil4u @ 3.11.2010, 22:18:45 ) *
Pokaż swój kod w obecnej formie. Lepiej jak będziesz operował CSS(el.style.własność) niż HTML(el.własność). Zobacz czy nigdzie nie brakuje Ci ";". Zarówno w CSS jak i w JS.


Tak wygląda mój kod teraz

Kod
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html>
<head>
  <meta http-equiv="Content-type" content="text/html; charset=iso-8859-2">
  <meta name="Description" content=" [wstaw tu opis strony] ">
  <meta name="Keywords" content=" [wstaw tu slowa kluczowe] ">
  <meta name="Author" content=" [dane autora] ">
  <meta name="Generator" content="kED2">

  <title> [tytuł strony] </title>

  <link rel="stylesheet" href=" [nazwa_arkusza_stylow.css] " type="text/css">
</head>
<body onload ="doTimer()">
<script language ="javascript" type "text/javascript">

var c=0;
var t;
var timer_is_on=0;

function timedCount()
{
c=c+1;

document.getElementById('wooYayMessage').innerHTML= c.toString();

document.getElementsByName('cos')[0].width="60%";
t=setTimeout("timedCount()",1000);
}

function doTimer()
{
if (!timer_is_on)
  {
  timer_is_on=1;
  timedCount();
  }
}


</script>
<div id ="wooYayMessage" style="height: 1.5em font-size: 2em; color:red">

</div>
<img src="pilka.jpg"  name ="cos" />
</body>
</html>
Go to the top of the page
+Quote Post
celbarowicz
post 4.11.2010, 13:23:17
Post #10





Grupa: Zarejestrowani
Postów: 253
Pomógł: 31
Dołączył: 30.03.2009
Skąd: Szczecin

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

a to?
[HTML] pobierz, plaintext 
  1. <html>
  2. <head>
  3. <script LANGUAGE="JavaScript">
  4. <!--
  5.  
  6. var szer=900;
  7. var wys=550;
  8.  
  9. function init()
  10. 		{ 
  11. 			dots= new dot();
  12.  
  13. 		}
  14.  
  15. function dot() { 
  16.  
  17.  
  18. 			this.obj=eval("dot1.style");
  19.  
  20. 		}
  21.  
  22. function skocz() {    
  23. 			dots.obj.left=parseInt(Math.random()*szer);
  24. 			dots.obj.top=parseInt(Math.random()*wys);
  25. 			document.images.obrazek.width+=15; 
  26.  			document.images.obrazek.height+=15;
  27.  
  28.  
  29.  
  30.  
  31. 					}
  32. -->
  33.  
  34. </SCRIPT>
  35.  
  36.  
  37. </head>
  38.  
  39. <body  onload="init();">
  40.  
  41. <div id="dot1" style="position:absolute;top:50; left:50; " >
  42. 		<a href="java script:void(0);" onmouseover="skocz();" >	<img src="kuba.jpg" height=80 width=80 name="obrazek"> </a>
  43. </div>
  44.  
  45.  
  46. </body>
  47. </html>
  48.  
[HTML] pobierz, plaintext
Go to the top of the page
+Quote Post
simman
post 4.11.2010, 13:56:09
Post #11





Grupa: Zarejestrowani
Postów: 21
Pomógł: 0
Dołączył: 23.05.2007

Ostrzeżenie: (10%)
X----

dzięki już wiem jak korzystać smile.gif a to najważniejsze. Myślę że ten temat powinien przeczytać każdy co zaczyna z javascript bo jest naprawdę ogrom potrzebnych informacji. Jeszcze raz dziękuje wszystkim za pomoc.
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

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

 

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

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

RSS Wersja Lo-Fi Aktualny czas: 19.06.2025 - 14:22
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn