Avaleht
uus teema   vasta Tarkvara »  Programmeerimine »  fadebutton märgi kõik teemad loetuks
märgi mitteloetuks
vaata eelmist teemat :: vaata järgmist teemat
Hinnavaatlus :: Foorum :: Uudised :: Ärifoorumid :: HV F1 ennustusvõistlus :: Pangalink :: Telekavad :: HV toote otsing
autor
sõnum Saada viide sõbrale. Teata moderaatorile
otsing:  
pesanet
HV kasutaja
pesanet

liitunud: 07.03.2007



Autoriseeritud ID-kaardiga
sõnum 08.03.2008 11:52:35 fadebutton vasta tsitaadiga
hei

tekkis 1 javascripti küsimus

kas saab teha mitu nuppu üksteise kõrvale/alla ka ja effecti muuta nii et hakkaks vilkuma `pidevalt just see nupp millele vajutatakse?


IE'ga töötab


http://javascript.internet.com/buttons/fading-button.html
Kommentaarid: 11 loe/lisa Kasutajad arvavad:  :: 0 :: 0 :: 11
tagasi üles
vaata kasutaja infot saada privaatsõnum
LWD
HV vaatleja

liitunud: 17.08.2007
sõnum 08.03.2008 12:00:40 vasta tsitaadiga
javascript:
  1.  
  2. <!-- TWO STEPS TO INSTALL FADING BUTTON:
  3.  
  4.   1.  Copy the coding into the HEAD of your HTML document
  5.   2.  Add the last code into the BODY of your HTML document  -->
  6.  
  7. <!-- STEP ONE: Paste this code into the HEAD of your HTML document  -->
  8.  
  9. <HEAD>
  10.  
  11. <SCRIPT LANGUAGE="JavaScript">
  12. <!-- Original:  Aidan Samuel (emmaster@yahoo.com) -->
  13. <!-- Web Site:  http://www.geocities.com/emmaster/ -->
  14.  
  15. <!-- This script and many more are available free online at -->
  16. <!-- The JavaScript Source!! http://javascript.internet.com -->
  17.  
  18. <!-- Begin
  19. hexColor = ["0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f"];
  20. function mOver(name) {
  21. for (i = 0; i < 13; i++) {
  22. setTimeout('document.myForm.'+name+'.style.background = "#'+hexColor[12-i]+'0'+hexColor[12-i]+'0c0";', i * 40);
  23.    }
  24. }
  25. function mOut(name) {
  26. document.myForm.button.value = "  Click Me!  ";
  27. for (i = 0; i < 12; i++) {
  28. setTimeout('document.myForm.'+name+'.style.background = "#'+hexColor[i]+'0'+hexColor[i]+'0c0";', i * 40);
  29.    }
  30. }
  31. //  End -->
  32. </script>
  33.  
  34. </HEAD>
  35.  
  36. <!-- STEP TWO: Copy this code into the BODY of your HTML document  -->
  37.  
  38. <BODY>
  39.  
  40. <form name=myForm>
  41. <input type=button name=button value="  Click Me!  " onMouseOver='mOver(this.name)' onMouseDown='this.value="Thank You!"' onClick='window.location="http://javascript.internet.com"' onMouseOut='mOut(this.name)'>
  42. <input type=button name=buttonb value="  Click Me!  " onMouseOver='mOver(this.name)' onMouseDown='this.value="Thank You!"' onClick='window.location="http://javascript.internet.com"' onMouseOut='mOut(this.name)'>
  43. </form>
  44.  
  45. <p><center>
  46. <font face="arial, helvetica" size"-2">Free JavaScripts provided<br>
  47. by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
  48. </center><p>
  49.  
  50. <!-- Script Size:  1.46 KB -->


Nii, mida ma seal siis muutsin:

*lahtritele pane erinevad nimed. Nt <input name="button" /> ja <input name="buttonb" />
*Pane hiireliigutustele argumendid: onMouseOver='mOver(this.name)' ja onMouseOut='mOut(this.name)'
*funktsioonidele argumendid: mOver(name) ja mOut(name)
*timeoutide elementidele argumendid: document.myForm.'+name+'.style.background

Peaks töötama
Kommentaarid: 2 loe/lisa Kasutajad arvavad:  :: 0 :: 0 :: 2
tagasi üles
vaata kasutaja infot saada privaatsõnum
pesanet
HV kasutaja
pesanet

liitunud: 07.03.2007



Autoriseeritud ID-kaardiga
sõnum 08.03.2008 12:34:51 vasta tsitaadiga
väga hea...
tegin koodi tiba ringi, idee oleks nüüd selles et kui play vajutada siis jääk see playing nupp vilkuma seniks kui mingile muule nupule näiteks stop nuple ei vajtata...


java:
  1.        
  2.  
  3.       <!-- TWO STEPS TO INSTALL FADING BUTTON:
  4.  
  5.        
  6.  
  7.         1.  Copy the coding into the HEAD of your HTML document
  8.  
  9.         2.  Add the last code into the BODY of your HTML document  -->
  10.  
  11.        
  12.  
  13.       <!-- STEP ONE: Paste this code into the HEAD of your HTML document  -->
  14.    
  15.        
  16.  
  17.       <HEAD>
  18.  
  19.        
  20.  
  21.       <SCRIPT LANGUAGE="JavaScript">
  22.  
  23.       <!-- Original:  Aidan Samuel (emmaster@yahoo.com) -->
  24.  
  25.       <!-- Web Site:  http://www.geocities.com/emmaster/ -->
  26.  
  27.        
  28.  
  29.       <!-- This script and many more are available free online at -->
  30.  
  31.       <!-- The JavaScript Source!! http://javascript.internet.com -->
  32.  
  33.        
  34.  
  35.       <!-- Begin
  36.  
  37.       hexColor = ["0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f"];
  38.  
  39.       function mOver(name) {
  40.  
  41.       for (i = 0; i < 13; i++) {
  42.  
  43.       setTimeout('document.myForm.'+name+'.style.background = "#'+hexColor[12-i]+'0'+hexColor[12-i]+'0c0";', i *
  44. 40);
  45.  
  46.          }
  47.  
  48.       }
  49.  
  50.       function mOut(name) {
  51.  
  52.       document.myForm.button.value = "  PLAY!  ";
  53.  
  54.       for (i = 0; i < 12; i++) {
  55.  
  56.       setTimeout('document.myForm.'+name+'.style.background = "#'+hexColor[i]+'0'+hexColor[i]+'0c0";', i * 40);
  57.  
  58.          }
  59.  
  60.       }
  61.  
  62.       //  End -->
  63.  
  64.       </script>
  65.  
  66.        
  67.  
  68.       </HEAD>
  69.  
  70.        
  71.  
  72.       <!-- STEP TWO: Copy this code into the BODY of your HTML document  -->
  73.  
  74.        
  75.  
  76.       <BODY>
  77.  
  78.        
  79.  
  80.       <form name=myForm>
  81.  
  82.       <input type=button name=button value="  PLAY!  " onMouseOver='mOver(this.name)'
  83. onMouseDown='this.value="Thank You!"' onClick='this.value="PLAYING!"'
  84. >
  85.  
  86.       <input type=button name=buttonb value="  STOP!  " onMouseOver='mOver(this.name)'
  87. onMouseDown='this.value="Thank You!"' onClick='window.location=""'
  88. onMouseOut='mOut(this.name)'>
  89.  
  90.       </form>
  91.  
  92.        
  93.  
  94.       <p><center>
  95.  
  96.       <font face="arial, helvetica" size"-2">Free JavaScripts provided<br>
  97.  
  98.       by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
  99.  
  100.       </center><p>
  101.  
  102.        
  103.  
  104.       <!-- Script Size:  1.46 KB -->
  105.  



midagi sellist et ennem timeouti ei antaks kui mingile muule nupule vajutada vms?
kuidas seda teha?
Kommentaarid: 11 loe/lisa Kasutajad arvavad:  :: 0 :: 0 :: 11
tagasi üles
vaata kasutaja infot saada privaatsõnum
LWD
HV vaatleja

liitunud: 17.08.2007
sõnum 08.03.2008 19:09:18 vasta tsitaadiga
javascript:
  1.  
  2. <!-- TWO STEPS TO INSTALL FADING BUTTON:
  3.  
  4.   1.  Copy the coding into the HEAD of your HTML document
  5.   2.  Add the last code into the BODY of your HTML document  -->
  6.  
  7. <!-- STEP ONE: Paste this code into the HEAD of your HTML document  -->
  8.  
  9. <HEAD>
  10.  
  11. <SCRIPT LANGUAGE="JavaScript">
  12. <!-- Original:  Aidan Samuel (emmaster@yahoo.com) -->
  13. <!-- Web Site:  http://www.geocities.com/emmaster/ -->
  14.  
  15. <!-- This script and many more are available free online at -->
  16. <!-- The JavaScript Source!! http://javascript.internet.com -->
  17.  
  18. <!-- Begin
  19. hexColor = ["0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f"];
  20. kontroll        = true;
  21. function mOver(id, i, suund) {
  22.         if (kontroll)   {
  23.                 document.getElementById(id).style.background = '#'+hexColor[i]+'0'+hexColor[i]+'0c0';
  24.                 if (suund && i==0)      {
  25.                         suund   = false;
  26.                         i              = 1;
  27.                 }
  28.                 else if (suund) {
  29.                         i--;
  30.                 }
  31.                 else if(!suund && i==15)        {
  32.                         suund   = true;
  33.                         i              = 14;
  34.                 }
  35.                 else    {
  36.                         i++;
  37.                 }
  38.                
  39.                 TID     = setTimeout("mOver('"+id+"', "+i+", "+suund+");", 40);
  40.         }
  41. }
  42. //  End -->
  43. </script>
  44.  
  45. </HEAD>
  46.  
  47. <!-- STEP TWO: Copy this code into the BODY of your HTML document  -->
  48.  
  49. <BODY>
  50.  
  51. <form name=myForm>
  52. <input type=button id="button" value="  Click Me!  " onclick='kontroll=true;mOver(this.id, 15, true)' />
  53. <input type=button id="buttonb" value="  Click Me!  " onclick='kontroll=true;mOver(this.id, 15, true)' />
  54. <input type="button" value="  STOP  " onclick="kontroll=false;clearTimeout(TID);" />
  55.  
  56. </form>
  57.  
  58. <p><center>
  59. <font face="arial, helvetica" size"-2">Free JavaScripts provided<br>
  60. by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
  61. </center><p>
  62.  
  63. <!-- Script Size:  1.46 KB -->


Põhimõte:
if (kontroll) {
setTimeout();
}

ja stop nupule vajutades on kontroll=false
Kommentaarid: 2 loe/lisa Kasutajad arvavad:  :: 0 :: 0 :: 2
tagasi üles
vaata kasutaja infot saada privaatsõnum
pesanet
HV kasutaja
pesanet

liitunud: 07.03.2007



Autoriseeritud ID-kaardiga
sõnum 10.03.2008 00:50:46 vasta tsitaadiga
töötab ilusti...

kas saab onclik'ga php skripte ka käivitada kuidagimoodi ilma et hüppaks teisele lahele või refreshiks.
Kommentaarid: 11 loe/lisa Kasutajad arvavad:  :: 0 :: 0 :: 11
tagasi üles
vaata kasutaja infot saada privaatsõnum
nn3_
HV kasutaja
nn3_

liitunud: 13.09.2003
sõnum 10.03.2008 00:52:23 vasta tsitaadiga
Saab ikka, märksõnaks AJAX.
Kommentaarid: 4 loe/lisa Kasutajad arvavad:  :: 1 :: 0 :: 3
tagasi üles
vaata kasutaja infot saada privaatsõnum
pesanet
HV kasutaja
pesanet

liitunud: 07.03.2007



Autoriseeritud ID-kaardiga
sõnum 10.03.2008 18:27:49 vasta tsitaadiga
saaks mõne näite ka ehk siia, ma ei tunna javascripti ega ajaxit hästi.
on aga tarvis http://localhost/mingiasi.php taustal käima tõmmata nupule vajutusega.
Kommentaarid: 11 loe/lisa Kasutajad arvavad:  :: 0 :: 0 :: 11
tagasi üles
vaata kasutaja infot saada privaatsõnum
andrusny
Kreisi kasutaja
andrusny

liitunud: 20.03.2006
sõnum 10.03.2008 20:08:08 vasta tsitaadiga
Arenda siit ise midagi edasi. Tegin kunagi katsetusi, see peaks töötav kood olema.
<span id="span_result"></span>

<script language="JavaScript">
var aadress;
//Gets the browser specific XmlHttpRequest Object
function getXmlHttpRequestObject() {
   if (window.XMLHttpRequest) {
      return new XMLHttpRequest(); //Not IE
   } else if(window.ActiveXObject) {
      return new ActiveXObject("Microsoft.XMLHTTP"); //IE
   } else {
      //Display your error message here.
      //and inform the user they might want to upgrade
      //their browser.
      alert("Your browser doesn't support the XmlHttpRequest object.  Better upgrade to Firefox.");
   }
}
//Get our browser specific XmlHttpRequest object.
var receiveReq = getXmlHttpRequestObject();
//Next we will write our function that is called when a user clicks our hyperlink.  This function will initiate the asycronous call.
//Initiate the asyncronous request.
function sayHello(aadress) {
   //If our XmlHttpRequest object is not in the middle of a request, start the new asyncronous call.
   if (receiveReq.readyState == 4 || receiveReq.readyState == 0) {
      //Setup the connection as a GET call to SayHello.html.
      //True explicity sets the request to asyncronous (default).
      receiveReq.open("GET", aadress, true);
      //Set the function that will be called when the XmlHttpRequest objects state changes.
      receiveReq.onreadystatechange = handleSayHello;
      //Make the actual request.
      receiveReq.send(null);
   }         
}
//Called every time our XmlHttpRequest objects state changes.
function handleSayHello() {
   //Check to see if the XmlHttpRequests state is finished.
   if (receiveReq.readyState == 4) {
      //Set the contents of our span element to the result of the asyncronous call.
      document.getElementById('span_result').innerHTML = receiveReq.responseText;
   }
}
sayHello('ax2.php?mat=3');
</script>

_________________
Kommentaarid: 7 loe/lisa Kasutajad arvavad:  :: 0 :: 0 :: 7
tagasi üles
vaata kasutaja infot saada privaatsõnum mine selle kasutaja kodulehele
pesanet
HV kasutaja
pesanet

liitunud: 07.03.2007



Autoriseeritud ID-kaardiga
sõnum 11.03.2008 01:31:46 vasta tsitaadiga
1 küsimus tekkis veel muidu,

kas nii saaks ka teha et vilguks ainult see nupp milllele vajutatakse?

muidu kõik funkab , tänud kõigile!
Kommentaarid: 11 loe/lisa Kasutajad arvavad:  :: 0 :: 0 :: 11
tagasi üles
vaata kasutaja infot saada privaatsõnum
LWD
HV vaatleja

liitunud: 17.08.2007
sõnum 11.03.2008 21:19:51 vasta tsitaadiga
javascript:
  1.  
  2. <!-- TWO STEPS TO INSTALL FADING BUTTON:
  3.  
  4.   1.  Copy the coding into the HEAD of your HTML document
  5.   2.  Add the last code into the BODY of your HTML document  -->
  6.  
  7. <!-- STEP ONE: Paste this code into the HEAD of your HTML document  -->
  8.  
  9. <HEAD>
  10.  
  11. <SCRIPT LANGUAGE="JavaScript">
  12. <!-- Original:  Aidan Samuel (emmaster@yahoo.com) -->
  13. <!-- Web Site:  http://www.geocities.com/emmaster/ -->
  14.  
  15. <!-- This script and many more are available free online at -->
  16. <!-- The JavaScript Source!! http://javascript.internet.com -->
  17.  
  18. <!-- Begin
  19. hexColor        = ["0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f"];
  20. nupud      = ["button", "buttonb"];
  21. kontroll        = true;
  22. TID               = false;
  23. algvarv  = '#666666';
  24.  
  25. function kaivita(id)    {
  26.         kontroll=false;
  27.         if (TID)        {
  28.                 clearTimeout(TID);
  29.         }
  30.         for (i=0;i<nupud.length;i++)    {
  31.                 document.getElementById(nupud[i]).style.background      = algvarv;
  32.         }
  33.         setTimeout("kontroll=true;mOver('"+id+"', 15, true);", 42);
  34. }
  35.  
  36. function peata()        {
  37.         kontroll=false;
  38.         if (TID)        {
  39.                 clearTimeout(TID);
  40.         }
  41.         for (i=0;i<nupud.length;i++)    {
  42.                 document.getElementById(nupud[i]).style.background      = algvarv;
  43.         }
  44. }
  45.  
  46. function mOver(id, i, suund) {
  47.         if (kontroll)   {
  48.                 document.getElementById(id).style.background = '#'+hexColor[i]+'0'+hexColor[i]+'0c0';
  49.                 if (suund && i==0)      {
  50.                         suund   = false;
  51.                         i              = 1;
  52.                 }
  53.                 else if (suund) {
  54.                         i--;
  55.                 }
  56.                 else if(!suund && i==15)        {
  57.                         suund   = true;
  58.                         i              = 14;
  59.                 }
  60.                 else    {
  61.                         i++;
  62.                 }
  63.                
  64.                 TID     = setTimeout("mOver('"+id+"', "+i+", "+suund+");", 40);
  65.         }
  66. }
  67. //  End -->
  68. </script>
  69. <style type="text/css">
  70. input   {
  71.         background: #666;
  72. }
  73. </style>
  74. </HEAD>
  75.  
  76. <!-- STEP TWO: Copy this code into the BODY of your HTML document  -->
  77.  
  78. <BODY>
  79.  
  80. <form name=myForm>
  81. <input type=button id="button" value="  Click Me!  " onclick='kaivita(this.id);' />
  82. <input type=button id="buttonb" value="  Click Me!  " onclick='kaivita(this.id);' />
  83. <input type="button" value="  STOP  " onclick="peata();" />
  84.  
  85. </form>
  86.  
  87. <p><center>
  88. <font face="arial, helvetica" size"-2">Free JavaScripts provided<br>
  89. by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
  90. </center><p>
  91.  
  92. <!-- Script Size:  1.46 KB -->



Paar asja, millele tähelepanu pöörata:

Panin koodi algusesse massiivi vilkuvate nuppude IDdega
nupud = ["button", "buttonb"];
See on vajalik, et vilkumise lõpetades taastada nende algne värv. Kui lisad oma lehele vilkuvaid nuppusid, siis pane neile külge ID silt ja lisa id javascripti nuppude massiivi.

Koodis on ka väärtus algvarv = '#666666'. Pane sinna värv, pilt vms. Vilkumise lõpetades omistatakse nuppudele selline taustavärv.
Kommentaarid: 2 loe/lisa Kasutajad arvavad:  :: 0 :: 0 :: 2
tagasi üles
vaata kasutaja infot saada privaatsõnum
näita postitusi alates eelmisest:   
uus teema   vasta Tarkvara »  Programmeerimine »  fadebutton
[vaata eelmist teemat] [vaata järgmist teemat]
 lisa lemmikuks
näita foorumit:  
 ignoreeri teemat 
sa ei või postitada uusi teemasid siia foorumisse
sa ei või vastata selle foorumi teemadele
sa ei või muuta oma postitusi selles foorumis
sa ei või kustutada oma postitusi selles foorumis
sa ei või vastata küsitlustele selles foorumis
sa ei saa lisada manuseid selles foorumis
sa võid manuseid alla laadida selles foorumis



Hinnavaatlus ei vastuta foorumis tehtud postituste eest.