gaya
-
Posts
101 -
Joined
-
Last visited
Content Type
Profiles
Forums
Events
Everything posted by gaya
-
The below code, The line is visible before the animation starts. I want to know how to hide that visible line? <!DOCTYPE html><html><body><canvas id="myCanvas" width="300" height="150">Your browser does not support the HTML5 canvas tag.</canvas><script src='https://code.jquery.com/jquery-2.1.3.js'></script><script>$(document).ready(function () { var canvas = document.getElementById('myCanvas'); var context = canvas.getContext('2d'); function Character1(canvas, progress, duration, delay) { console.log("c1 " + progress); delay = delay || 1; var ctx = canvas.getContext('2d'); debugger; if (progress < duration) { canvas.strokeStyle = "black"; ctx.beginPath(); ctx.moveTo(1, 13); ctx.lineTo(1 * ((progress + 1) / duration), 30); ctx.stroke(); ctx.closePath() setTimeout(function () { Character1(canvas, progress + 1, duration, delay); }, delay); } else { debugger; $(document.body).trigger("Character1Completed"); } } // Start Drawing Character1(canvas, 0, 30, 33);});</script></body></html>
-
Hi,I want to draw animation with same speed. I am having some three functions. I want to call it one after another. Please tell me how to do it. <!DOCTYPE html><html><body><canvas id="myCanvas" width="300" height="150">Your browser does not support the HTML5 canvas tag.</canvas><script>var c = document.getElementById("myCanvas");var ctx = c.getContext("2d");var c1 = document.getElementById("myCanvas");var ctx1 = c.getContext("2d");var c2 = document.getElementById("myCanvas");var ctx2 = c.getContext("2d");var canvas = document.getElementById('myCanvas');var context = canvas.getContext('2d');var amount = 0.5;var amount1 = 0;var amount2 = 0;var amount3 = 0.4;var myVar = setInterval(function(){ myTimer2() }, 10);function myTimer2() { amount += 0.05; // change to alter duration if (amount > 1) amount = 1; c.strokeStyle = "black"; ctx.beginPath();ctx.moveTo(3, 12);ctx.lineTo(3, 30*amount);ctx.stroke();ctx.closePath()}var myVar1 = setInterval(function(){ myTimer1() }, 20);function myTimer1() { amount1 += 0.05; // change to alter duration if (amount1 > 1) amount1 = 1; c1.strokeStyle = "black"; ctx1.beginPath();ctx1.moveTo(5,30);ctx1.lineTo(30*amount1, 30);ctx1.stroke(); ctx1.closePath()}var x = 23; var y = 22; var radius = 9;var startAngle = .3* Math.PI;var endAngle = -1.3* Math.PI;var counterClockwise = false;var myVar4 = setInterval(function(){ myTimer4() }, 95);function myTimer4() { amount3 += 0.05; // change to alter duration if (amount3 > 1) amount3 = 1; context.beginPath(); context.arc(x, y, radius, startAngle, endAngle*amount3, true); context.lineWidth = 1; context.stroke();}</script></body></html> Insted of setInterval what we can use.The above code all the three are drawing at same time. I want to draw one by one but with same speed. Please help me to do it.
-
Thanks for the reply. I got the curve in anticlockwise direction. By switching the values of startAngle and endAngle also by incrementing the startAngle value. Changed the amount3 value too. <!DOCTYPE html><html><body><canvas id="myCanvas" width="300" height="150">Your browser does not support the HTML5 canvas tag.</canvas><script>var canvas = document.getElementById('myCanvas');var context = canvas.getContext('2d');var amount3 = .4;var x = 23;var y = 22;var radius = 9;var startAngle = 8.3* Math.PI;var endAngle = .3 * Math.PI;var counterClockwise = false;var myVar4 = setInterval(function(){ myTimer4() }, 125);function myTimer4() { amount3 += 0.2; // change to alter duration if (amount3 > 2) amount3 = 2; context.beginPath(); context.arc(x, y, radius, startAngle*amount3, endAngle, counterClockwise); context.lineWidth = 1; context.stroke();}</script></body></html> It is drawing too fast. I want the animation to draw a little slow. I don't knw whether i have to increase or decrease the value i have give. please tell me what to be changed. Or please give some ideas to draw this curve.
-
By switching the values of startAngle and endAngle is drawing a small curve in clockwise direction. I tried by incrementing the value also. But by incrementing the value it is drawing a circle or the curve is not drawn in animation.
-
Thanks for the reply. Yes i understood your code. Sorry for asking the question again. Please i want that curve drawing in anti clockwise direction. If thats the condition where some value is to be changed. But please tell me where to change that values. <!DOCTYPE html><html><body><canvas id="myCanvas" width="300" height="150">Your browser does not support the HTML5 canvas tag.</canvas><script>var canvas = document.getElementById('myCanvas');var context = canvas.getContext('2d');var amount3 = 0.4; var x = 23; var y = 22; var radius = 9; var startAngle = .7* Math.PI; var endAngle = 2.3 * Math.PI; var counterClockwise = false;var myVar4 = setInterval(function(){ myTimer4() }, 75);function myTimer4() { amount3 += 0.05; // change to alter duration if (amount3 > 1) amount3 = 1;context.beginPath(); context.arc(x, y, radius, startAngle, endAngle*amount3, counterClockwise); context.lineWidth = 1; context.stroke();}</script></body></html> In the above code it is drawing half circle but in clockwise direction. I want the same circle to be drawn in anticlockwise direction.
-
HI. I am trying to draw a animated curve. The curve is drawn. But the animation to draw the curve is not correct. please help me how to draw.My code is <!DOCTYPE html><html><body><canvas id="myCanvas" width="300" height="150">Your browser does not support the HTML5 canvas tag.</canvas><script>var c = document.getElementById("myCanvas");var ctx = c.getContext("2d");var c1 = document.getElementById("myCanvas");var ctx1 = c.getContext("2d");var canvas = document.getElementById('myCanvas');var context = canvas.getContext('2d');var amount = 0.5;var amount1 = 0;var amount3 = 0.4;var x = 23; var y = 22; var radius = 9; var startAngle = 7.75* Math.PI; var endAngle = 0.3 * Math.PI; var counterClockwise = false;var myVar4 = setInterval(function(){ myTimer4() }, 275);function myTimer4() { amount3 += 0.05; // change to alter duration if (amount3 > 1) amount3 = 1;context.beginPath(); context.arc(x, y, radius, startAngle*amount3, endAngle, counterClockwise); context.lineWidth = 1; context.stroke();}</script>
-
Hi,i have done all in php like giving link to image, by clicking the image the value get insert into database. How shall i do this. Please tell me. The following is the code for image link and insert query. if($flag1==0) { echo "<a href='newpartshort.php?orderno=$ono∂=$part&qpid=$qpid&board=$board&subject=$subject&StudentId=$StudentId&totalrows=$totalRows1'><img src='image/redtrial.png' align='right' border=0 width='15px' height='15px'/></a>"; }$sql1="insert into valuation values('','$uid','$ono','$qno','$sub','$qpid','$tabname','$part','$mark','0','$Path1')"; Insertion should take place. Please tell me how to do this.
-
I aligned it simply by putting align="center". But my images are seenn without anyspace. How to make space or seperate my images.
-
Hi,I am having a form with a textarea and some textbox.I dont know how to align in into my form. i.e)I have aligned but i want to make the fields seen in center of the form. Please tell me how to align it.
-
Thanks justsomeguy. I included the following code to hide the editor,by clicking the button again. Thanks all.
-
Anyone please tell me. Is that possible to do.
-
Now i have done for more than one textarea. Still having one problem. By clicking the button the editor is opening. Now i want to do is, again by clicking the button i want to hide the symbols even if i have not selected anything from the editor. Please tell me what to modify for that.
-
Thanks AndrewSmith. I tried your code and its working fine. But what i am expecting is not this. The above code what i have posted is now working fine for me. Now my problem is the above code, I am having only one textarea. But in the case of having more than one textarea means how i can modify the code, that thing i don't know. Please tell me how to do that.
-
I have already tried the following code. <!DOCTYPE html><html><head> <style> .popup { position: absolute; left: 100px; top: 100px; border: 1px solid #000; background-color: #f0f0f0; } .popup .symbol { display: inline-block; padding: 5px; margin: 10px; border: 1px solid #000; } </style> <script> var symbolPopup = null; function CreateSymbolPopup () { if (symbolPopup) { return; } symbolPopup = document.createElement ('div'); symbolPopup.className = "popup"; var symbols = [8719, 8721, 8730]; for (var i = 0; i < symbols.length; i++) { var symbolButton = document.createElement ('span'); symbolButton.innerHTML = '' + symbols[i] + ';'; symbolButton.onclick = AddSymbol; symbolButton.className = "symbol"; symbolPopup.appendChild (symbolButton); } document.body.appendChild (symbolPopup); } function ShowSymbols () { CreateSymbolPopup (); symbolPopup.style.display = ""; } function HideSymbols () { if (symbolPopup) { symbolPopup.style.display = "none"; } } function AddSymbol () { var editor = document.getElementById ('editor'); editor.value += this.innerHTML; HideSymbols (); } </script></head><body> <button onclick="ShowSymbols ()">Symbols</button> <textarea id="editor"></textarea></body></html> In the above code, by clicking the symbol button,I want to display the value inside the textbox and not the symbol.Also i want the value seen inbetween font tags.
-
I cann't understand Which part do you need help with? I want help in creating the math symbols with onclick. How shall i create it.
-
HiI need help in creating a math editor to my form. Please tell me how to create a math editor which includes all symbols like sigma,pi etc. By clicking a button i want to get open the math editor. And after selecting the symbol from math editorit should seen like <font symbol=√>√</font> Please tell me how to do that.√=√The value alone will seen inbetween font tags √
-
Thanks dsonesuk. Thanks for the help.
-
Sorry for asking again. By clicking the image the palette get open, and i want to do is after selecting the color i want to hide the palette automatically. Please tell me how to do that.
-
Thanks dsonesuk. I did exactly what i need.I missed to include var s_url=block1.href;var pColor=s_url.substr(s_url.indexOf("#")); Now i got it. Thank again for you both.The problem is completely solved.
-
I found out but still having some problems. In the above code i changed in the function getColor(block)Instead of this code function getColor(block){//alert(block);for(var t = 0; t <= x.length; ++t){ document.getElementById( x[t] ).style.Color = block;alert(document.getElementById( x[t] ).style.Color); }} I changed function getColor(block){document.getElementsByTagName('textarea').value=block;} <input type="button" value="Font" onclick="font ([ques1,ques2,opt1,opt2,opt3,opt4],'font',document.getElementById('ss').value,document.getElementById('aa').value,document.getElementsByTagName('textarea').value);"> Now my problem is in mytextarea i get the full web address,as i've to get only the color code. Please tell me what can i change there.
-
<script type="text/javascript">function getColor1(id) { var clr = document.getElementById(id); if (clr.style.visibility=="visible") { clr.style.visibility="hidden"; } else { clr.style.visibility="visible"; }}var x = [ "ques1", "ques2", "opt1", "opt2", "opt3", "opt4" ];function getColor(block){//alert(block);for(var t = 0; t <= x.length; ++t){ document.getElementById( x[t] ).style.Color = block;alert(document.getElementById( x[t] ).style.Color); }}function changeSize(size){document.getElementById("ss").value;}function updateh1family(name) {document.getElementById("aa").value;}function font(elems,tag,size,name,block){//alert(size);alert(block);var i=0, el, selectedText, newText;while(el=elems[i++]){selectedText=document.selection?document.selection.createRange().text:el.value.substring(el.selectionStart,el.selectionEnd);// IE:Mozif(selectedText!=''){newText='<'+tag+' size='+size+' face='+name+' color='+block+'>'+selectedText+'</'+tag+'>'; if(document.selection){//IE document.selection.createRange().text=newText; return;//prevents the double replacement } else{//Moz el.value=el.value.substring(0,el.selectionStart)+newText+el.value.substring(el.selectionEnd,el.value.length); }}}}</script><form accept-charset="utf-8" action="b.html" method="post" name="fillup" enctype="multipart/form-data" onSubmit="return validate();"><tr><td><table align="center" bgcolor=""> <tr><td align="center" colspan="10"><img src="img/laugh.gif" alt="Smiley" /></td></tr> <tr><td align="center" style="color:#FF0000; text-decoration:blink;" colspan="10" ><b><?php echo $qtype1;?></b></td></tr> <tr><td colspan="10"> </td></tr> <tr><td align="center" colspan="10"><img src="img/subst.png" title="substring" onclick="formatText ([ques1,ques2,opt1,opt2,opt3,opt4],'sub');"> <img src="img/supst.png" title="superstring" onclick="formatText1 ([ques1,ques2,opt1,opt2,opt3,opt4],'sup');"><!--<input type="button" value="Font" onclick="font ([ques1,ques2,opt1,opt2,opt3,opt4],'font');">--> <img src="img/mover.png" title="mover,mout" onclick="mover ([ques1,ques2,opt1,opt2,opt3,opt4],'mover','mout');"></td></tr><img src="img/supst.png" id="color" onclick="getColor1('imgclr');" /><br/><img id="imgclr" src="img/palette.gif" usemap="#color_pallete" style="visibility:hidden"/><map name="color_pallete" id="color_pallete"> <area shape="rect" coords="7,7,31,30" href="#FF0000" onclick="getColor(this);" /> <area shape="rect" coords="35,7,59,30" href="#00FF00" onclick="getColor(this);" /> <area shape="rect" coords="63,7,87,31" href="#0000FF" onclick="getColor(this);" /> <area shape="rect" coords="92,7,115,31" href="#8B008B" onclick="getColor(this);" /> <area shape="rect" coords="7,33,30,58" href="#00FFFF" onclick="getColor(this);"/> <area shape="rect" coords="36,34,59,57" href="#006400" onclick="getColor(this);" /> <area shape="rect" coords="63,34,86,58" href="#6B8E23" onclick="getColor(this);" /> <area shape="rect" coords="92,35,115,57" href="#00FF7F" onclick="getColor(this);" /> <area shape="rect" coords="8,61,31,85" href="#32CD32" onclick="getColor(this);" /> <area shape="rect" coords="35,62,59,85" href="#7FFFD4" onclick="getColor(this);" /> <area shape="rect" coords="64,61,86,85" href="#7FFF00" onclick="getColor(this);" /> <area shape="rect" coords="92,61,115,85" href="#008B8B" onclick="getColor(this);" /> <area shape="rect" coords="91,88,115,111" href="#9932CC" onclick="getColor(this);" /> <area shape="rect" coords="64,88,87,111" href="#00BFFF" onclick="getColor(this);" /> <area shape="rect" coords="36,88,59,112" href="#1E90FF" onclick="getColor(this);" /> <area shape="rect" coords="8,88,30,111" href="#FF4500" onclick="getColor(this);" /> </map><span id="colorPalDemo"></span>Font size:<select name="sizeselect" id="ss" onchange="changeSize(this.value)"><option value="10">10</option><option value="13">13</option><option value="15">15</option><option value="17">17</option></select><input type="button" value="Font" onclick="font ([ques1,ques2,opt1,opt2,opt3,opt4],'font',document.getElementById('ss').value,document.getElementById('aa').value,document.getElementById( x[t] ).style.Color);"><select name="selectFontFamily" id="aa" onchange="updateh1family(this.value)"> <option value="Serif">Serif</option> <option value="Arial">Arial</option> <option value="Sans-Serif">Sans-Serif</option> <option value="Tahoma">Tahoma</option> </select><td> Statement1<font color="#0000FF">*</font> </td> <td><textarea name="ques1" id="ques1" cols="25" rows="5" style="width: 220px; height: 100px;"></textarea> </td><td> Statement2<font color="#0000FF">*</font> </td> <td><textarea name="ques2" id="ques2" cols="25" rows="5" style="width: 220px; height: 100px;"></textarea> </td><td> Option1<font color="red">*</font> </td> <td> <textarea name="opt1" id="opt1" cols="25" rows="3" style="width: 220px; height: 100px;"></textarea> </td> The above is my code. When clicking the fonr button the tag didn't get open. I don't know why. Please tell me what i am doing wrong here.
-
Thanks dsonesuk. Instead of span tag function getColor(block){var s_url=block.href;var pColor=s_url.substr(s_url.indexOf("#"));document.getElementById("colorPalDemo").style.color=pColor;} <span id="colorPalDemo">gayu</span> I have to use like var all = document.getElementsByTagName("a");for(var i = 0, max = all.length; i < max; i++){ alert(all[i].innerHTML);}
-
But more than one textarea i am having. How to make the color for all textarea.
-
<html><head><script type="text/javascript">function getColor1(id) { var clr = document.getElementById(id); if (clr.style.visibility=="visible") { clr.style.visibility="hidden"; } else { clr.style.visibility="visible"; }}function getColor(block){//alert("hai1");alert(block);var s_url=block.href;var pColor=s_url.substr(s_url.indexOf("#"));document.getElementById("colorPalDemo").style.color=pColor;//document.getElementById("clr").style.display=hidden;//getColor1();} </script></head><body><img src="img/supst.png" id="color" onclick="getColor1('imgclr');" /><br/><img id="imgclr" src="img/palette.gif" usemap="#color_pallete" style="visibility:hidden"/><map name="color_pallete" id="color_pallete"> <area shape="rect" coords="7,7,31,30" href="#FF0000" onclick="getColor(this);" /> <area shape="rect" coords="35,7,59,30" href="#00FF00" onclick="getColor(this);" /> <area shape="rect" coords="63,7,87,31" href="#0000FF" onclick="getColor(this);" /> <area shape="rect" coords="92,7,115,31" href="#8B008B" onclick="getColor(this);" /> <area shape="rect" coords="7,33,30,58" href="#00FFFF" onclick="getColor(this);"/> <area shape="rect" coords="36,34,59,57" href="#006400" onclick="getColor(this);" /> <area shape="rect" coords="63,34,86,58" href="#6B8E23" onclick="getColor(this);" /> <area shape="rect" coords="92,35,115,57" href="#00FF7F" onclick="getColor(this);" /> <area shape="rect" coords="8,61,31,85" href="#32CD32" onclick="getColor(this);" /> <area shape="rect" coords="35,62,59,85" href="#7FFFD4" onclick="getColor(this);" /> <area shape="rect" coords="64,61,86,85" href="#7FFF00" onclick="getColor(this);" /> <area shape="rect" coords="92,61,115,85" href="#008B8B" onclick="getColor(this);" /> <area shape="rect" coords="91,88,115,111" href="#9932CC" onclick="getColor(this);" /> <area shape="rect" coords="64,88,87,111" href="#00BFFF" onclick="getColor(this);" /> <area shape="rect" coords="36,88,59,112" href="#1E90FF" onclick="getColor(this);" /> <area shape="rect" coords="8,88,30,111" href="#FF4500" onclick="getColor(this);" /> </map><span id="colorPalDemo">gayu</span> </body></html> I hope the above code like is what you ask me to do. But another doubt is the span tag is to change the color for values seen inbetween the tag. But this i don't want. I want to change the color in all my textarea. How to do that. Please tell me.
-
Sorry to ask you again and again dsonesuk. Please tell where i have to use the value 'hidden'.Also my actual problem is by clicking the supst img the palette is get opened. But i cann't able to select the colors.