Jump to content

danman97

Members
  • Content Count

    27
  • Joined

  • Last visited

Community Reputation

0 Neutral

About danman97

  • Rank
    Newbie

Previous Fields

  • Languages
    HTML, CSS, Javascript

Contact Methods

  • Website URL
    http://meljones.info
  • ICQ
    0

Profile Information

  • Location
    UK
  1. Thanks, working now! Swapped all but the " " around the onclick string. Link: http://dl.dropbox.co...Untitled-2.html
  2. Do you mean how the '\' are missing. They dont seem to show on the forum but they are there on the web page. I just checked the Dev Tools and they are there... Or have you found another problem. I just cant find it!
  3. Hi I have continued a second page with a Popup Generator now (http://dl.dropbox.co...Untitled-2.html) but have come across a problem. I get no error but the link just won't open. Short Code: <!DOCTYPE html><head><script>/*Functions*/function editLink(){var lText= document.getElementById('linkText');var lURL= document.getElementById('linkURL');var lUL= lUL_value();var popH= document.getElementById('popH');var popW= document.getElementById('popW');var taValue= document.getElementById('taHTMLoutput');function lUL_value(){if (document.getElementById('uLine_yes').checked){ return "text-decoration:underline;";} else if (document.getElementById('uLine_no').checked){ return "text-decoration:none;";};};function changeHTML(){return "<a onClick="window.open("" + lURL.value + "","_blank","toolbar=yes, location=yes, directories=no, status=no, menubar=yes, scrollbars=yes, resizable=no, copyhistory=yes, width=" + popW.value + ", height=" + popH.value + "");" style="" + lUL + "">" + lText.value + "</a>";};taValue.value= changeHTML();document.getElementById('outputP').innerHTML= "<a onClick="window.open("" + lURL.value + "","_blank","toolbar=yes, location=yes, directories=no, status=no, menubar=yes, scrollbars=yes, resizable=no, copyhistory=yes, width=" + popW.value + ", height=" + popH.value + "");" style="" + lUL + "">" + lText.value + "</a>";}</script></head> <body><div id="uberContainer"><table width="100%"><tbody><tr><td><div id="mainContainer"><table align="center"><tr><td><form id="form1" onsubmit="return false;" style="border:1; border:#666"><legend><h3>Popup Details</h3></legend><div id="formContainer"><table><tr><td><label for="linkText">Link Text</label></td><td><input class="inputRight" id="linkText" autofocus="autofocus" placeholder="Mel Jones Photography Ltd." required size="40" type="text" autocomplete="on" /></td></tr> <tr><td><label for="linkURL">Link URL</label></td><td><input type="url" required class="inputRight" id="linkURL" placeholder="http://meljones.info/" autocomplete="on" size="40" /></td></tr><tr><td><label for="uLine">Underline</label></td><td><input id="uLine_yes" type="radio" name="uLine" value="yes" /> Yes <input id="uLine_no" type="radio" name="uLine" value="no" /> No</td></tr><tr><td><label for"linkCol">Colour</label></td><td><input id="linkCol" type="color" disabled /></td><tr><td><label for"popH">Height</label></td><td><input id="popH" placeholder="400" value="400" required type="number" /></td></tr><tr><td><label for"popW">Width</label></td><td><input id="popW" placeholder="600" value="600" required type="number" /></td></tr><tr><td></td><td><button onclick="editLink();">Amend Link!</button></tr></table></div></form></td><td><table><tr><td><h3>Output: </h3></td><td><p id="outputP"></p></td></tr><tr><td>HTML:</td><td><form id="formHTMLoutput"><textarea onClick="select_content('taHTMLoutput');" value="" id="taHTMLoutput"readonly placeholder="The HTML code for the Popup will appear here!"></textarea></form></td></tr></table></td></tr></table></div></td><td width="250px"></td></tr></tbody></table></div></body></html> Thanks
  4. Thanks, I just couldn't figure out what was wrong and so again tried using getelementbyid and worked. Dont know what was happening other times. Thanks @Ingolme and @thescientist. It works now.
  5. Hmmm... No change there. I've been changing it back and forth alot but not affecting anything...
  6. Thanks for pointing that out but that's not the main problem I want solving. I keep making that mistake too!Infact, I shall take away the css in the head and other stuff that is irrelevant.
  7. Hi I'm trying to build a Link Generator (just for practice) and am trying to add the option to specify whether it is underlined (using style attribute). However, it no longer works at all. Can someone help? Link: http://dl.dropbox.co...Untitled-3.html Relevant Code: <head><script>/*Functions*/function editLink(){var lText= document.getElementById('linkText');var lURL= document.getElementById('linkURL');var lUL= lUL_value();var taValue= document.getElementById('taHTMLoutput');function lUL_value(){var a=document.form1.uLine;if ('a==yes'){return "style=\"text-decoration:underline;\"";}else{return "style=\"text-decoration:none;\"";};}function changeHTML(){return "<a href=\"" + lURL.value + "\" " + lUL.value + ">" + lText.value + "</a>";};taValue.value= changeHTML();document.getElementById('outputP').innerHTML = "<a href=\"" + lURL.value + "\" " + lUL + ">" + lText.value + "</a>";}function select_content(elementID) { // first set focus document.getElementById([elementID]).focus(); // select all contents document.getElementById([elementID]).select(); }function writepageTitle(){// not workingvar pgTitle= document.getElementById('title');document.getElementById('footerpageTitle').innerHTML = pgTitle.innerHTML;}/*Other*/window.onload = 'writepageTitle';// ^^ not working ^^ //</script></head> <body><div id="uberContainer"><header>...</header><div id="mainContainer"><table align="center"><tr><td><form id="form1" onsubmit="return false;" style="border:1; border:#666"><legend><h3>Link Details</h3></legend><div id="formContainer"><table><tr><td><label for="linkText">Link Text</label></td><td><input class="inputRight" id="linkText" autofocus="autofocus" placeholder="Mel Jones Photography Ltd." required size="40" type="text" autocomplete="on" /></td></tr><br /><tr><td><label for="linkURL">Link URL</label></td><td><input type="url" required class="inputRight" id="linkURL" placeholder="http://meljones.info/" autocomplete="on" size="40" /></td></tr><tr><td><label for="uLine">Underline</label></td><td><input id="uLine_yes" type="radio" name="uLine" value="yes" /> Yes <input id="uLine_no" type="radio" name="uLine" value="no" /> No<br /></td></tr><tr><td></td><td><button onclick="editLink();">Amend Link!</button></tr></table></div></form></td><td><table><tr><td><h3>Output: </h3></td><td><p id="outputP"></p></td></tr><tr><td>HTML:</td><td><form id="formHTMLoutput"><textarea onClick="select_content('taHTMLoutput');" value="" id="taHTMLoutput"readonly placeholder="The HTML code for the Link will appear here!"></textarea></form></td></tr></table></td></tr></table></div><footer>...</footer></div></body></html> Full Code: <!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title id="title">Element Express.: Link Maker!</title><style>/* element styling *//* */a{color:#F28705;text-decoration:none;}a:visited{color:#BF3604;}body{font:Tahoma, Geneva, sans-serif;font-family:Tahoma, Geneva, sans-serif;background-color:#324452;color:#cccccc;}textarea{max-width:600px;min-width:350px;min-height:100px;}table{vertical-align:text-top;}hr{ }input{vertical-align:text-top;}/* element id styling *//* */div#uberContainer{max-width:75%;margin-left:auto;margin-right:auto;left:50%;outline:solid;outline-color:#97BDBF;min-height:100%;}nav#mainNav{vertical-align:top;right: 10%;}/* classes *//* */.inputRight{margin-left:auto;left:100%;}.class1{color:#97BDBF;}</style><script>/*Functions*/function editLink(){var lText= document.getElementById('linkText');var lURL= document.getElementById('linkURL');var lUL= lUL_value();var taValue= document.getElementById('taHTMLoutput');function lUL_value(){var a=document.form1.uLine;if ('a==yes'){return "style=\"text-decoration:underline;\"";}else{return "style=\"text-decoration:none;\"";};}function changeHTML(){return "<a href=\"" + lURL.value + "\" " + lUL.value + ">" + lText.value + "</a>";};taValue.value= changeHTML();document.getElementById('outputP').innerHTML = "<a href=\"" + lURL.value + "\" " + lUL + ">" + lText.value + "</a>";}function select_content(elementID) { // first set focus document.getElementById([elementID]).focus(); // select all contents document.getElementById([elementID]).select(); }function writepageTitle(){// not workingvar pgTitle= document.getElementById('title');document.getElementById('footerpageTitle').innerHTML = pgTitle.innerHTML;}/*Other*/window.onload = 'writepageTitle';// ^^ not working ^^ //</script></head> <body><div id="uberContainer"><header><table id="table_deleteID" width="100%"><tbody><tr><td><h1>Welcome!</h1></td><td width="50%" align="right"><nav id="mainNav"><a href="">Home</a> | <div id="elementsnavContainer"><a onmouseover="">Show stuff on mouse over!</a><br><div id="elementsnavDropdown">Hey</div></div></nav></td></tr></tbody></table><div id="mydiv2" style="cursor:crosshair"></div><hr class="class1" /></header><div id="mainContainer"><table align="center"><tr><td><form id="form1" onsubmit="return false;" style="border:1; border:#666"><legend><h3>Link Details</h3></legend><div id="formContainer"><table><tr><td><label for="linkText">Link Text</label></td><td><input class="inputRight" id="linkText" autofocus="autofocus" placeholder="Mel Jones Photography Ltd." required size="40" type="text" autocomplete="on" /></td></tr><br /><tr><td><label for="linkURL">Link URL</label></td><td><input type="url" required class="inputRight" id="linkURL" placeholder="http://meljones.info/" autocomplete="on" size="40" /></td></tr><tr><td><label for="uLine">Underline</label></td><td><input id="uLine_yes" type="radio" name="uLine" value="yes" /> Yes <input id="uLine_no" type="radio" name="uLine" value="no" /> No<br /></td></tr><tr><td></td><td><button onclick="editLink();">Amend Link!</button></tr></table></div></form></td><td><table><tr><td><h3>Output: </h3></td><td><p id="outputP"></p></td></tr><tr><td>HTML:</td><td><form id="formHTMLoutput"><textarea onClick="select_content('taHTMLoutput');" value="" id="taHTMLoutput"readonly placeholder="The HTML code for the Link will appear here!"></textarea></form></td></tr></table></td></tr></table></div><footer><hr><table width="100%"><tbody><tr><td align="center" width="33%"><a href="http://www.meljones.info/">Mel Jones Photography Ltd.</a></td><td align="center" width="34%">© Daniel Carl 2011</td><td align="center" width="33%"><p id="footerpageTitle"></p></td></tr></tbody></table></footer></div></body></html>
  8. danman97

    alert notation

    Your Welcome... Even though my method didn't work.
  9. All working now, Thank You!Had to stop the form resetting to make it work. Soloution Here: Stop Form ResetFull Working Code: <!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Link Maker!</title><style>/* element styling *//* */a{ color:#F28705;}a:visited{ color:#BF3604;}body{ font:Tahoma, Geneva, sans-serif; font-family:Tahoma, Geneva, sans-serif; background-color:#324452; color:#cccccc;}textarea{ max-width:600px; min-width:350px; min-height:100px;}table{ vertical-align:text-top;}/* element id styling *//* */div#uberContainer{ max-width:75%; margin-left:auto; margin-right:auto; left:50%; outline:solid; outline-color:#97BDBF;}nav#mainNav{ vertical-align:top; right: 10%;}/* classes *//* */.inputRight{ margin-left:auto; left:100%;}.class1{ color:#97BDBF;}</style><script>function editLink(){ var lText= document.getElementById('linkText'); var lURL= document.getElementById('linkURL'); var taValue= document.getElementById('taHTMLoutput'); function changeHTML() { return "<a href=\"" + lURL.value + "\">" + lText.value + "</a>"; }; taValue.value= changeHTML(); document.getElementById('outputP').innerHTML = "<a href=\"" + lURL.value + "\">" + lText.value + "</a>";}function select_content(elementID) { // first set focus document.getElementById([elementID]).focus(); // select all contents document.getElementById([elementID]).select(); }</script></head><body><div id="uberContainer"><header><table width="100%"><tbody><tr><td><h1>Welcome!</h1></td><td align="right"><nav id="mainNav"><a href="">Home</a><a onmouseover="">Show stuff on mouse over!</a></nav></td></tr></tbody></table><hr class="class1" /></header><div id="mainContainer"><table align="center"><tr><td><form id="form1" onsubmit="return false;" style="border:1; border:#666"><legend><h3>Link Details</h3></legend><div id="formContainer"><table><tr><td><label for="linkText">Link Text</label></td><td><input class="inputRight" id="linkText" autofocus="autofocus" placeholder="Mel Jones Photography Ltd." required size="40" type="text" autocomplete="on" /></td></tr><br /><tr><td><label for="linkURL">Link URL</label></td><td><input type="url" required class="inputRight" id="linkURL" placeholder="http://meljones.info/" autocomplete="on" size="40" /></td></tr><tr><td></td><td><button onclick="editLink();">Amend Link!</button></tr></table></div></form></td><td><table><tr><td><h3>Output: </h3></td><td><p id="outputP"></p></td></tr><tr><td>HTML:</td><td><form id="formHTMLoutput"><textarea onClick="select_content('taHTMLoutput');" value="" id="taHTMLoutput"readonly placeholder="The HTML code for the Link will appear here!"></textarea></form></td></tr></table></td></tr></table></div></div></body></html>
  10. Yes, thank you . Hadn't noticed it refreshed (probably because I was testing locally!).I added a onSubmit event to the form to return false;Working Code: <!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Link Maker!</title><style>/* element styling *//* */a{ color:#F28705;}a:visited{ color:#BF3604;}body{ font:Tahoma, Geneva, sans-serif; font-family:Tahoma, Geneva, sans-serif; background-color:#324452; color:#cccccc;}textarea{ max-width:600px; min-width:350px; min-height:100px;}table{ vertical-align:text-top;}/* element id styling *//* */div#uberContainer{ max-width:75%; margin-left:auto; margin-right:auto; left:50%; outline:solid; outline-color:#97BDBF;}nav#mainNav{ vertical-align:top; right: 10%;}/* classes *//* */.inputRight{ margin-left:auto; left:100%;}.class1{ color:#97BDBF;}</style><script>function editLink(){ var lText= document.getElementById('linkText'); var lURL= document.getElementById('linkURL'); var taValue= document.getElementById('taHTMLoutput'); function changeHTML() { return "<a href=\"" + lURL.value + "\">" + lText.value + "</a>"; }; taValue.value= changeHTML();}</script></head><body><div id="uberContainer"><header><table width="100%"><tbody><tr><td><h1>Welcome!</h1></td><td align="right"><nav id="mainNav"><a href="">Home</a><a onmouseover="">Show stuff on mouse over!</a></nav></td></tr></tbody></table><hr class="class1" /></header><div id="mainContainer"><table align="center"><tr><td><form onsubmit="return false;" style="border:1; border:#666"><legend><h3>Link Details</h3></legend><div id="formContainer"><table><tr><td><label for="linkText">Link Text</label></td><td><input class="inputRight" id="linkText" autofocus="autofocus" placeholder="Mel Jones Photography Ltd." required size="40" type="text" autocomplete="on" /></td></tr><br /><tr><td><label for="linkURL">Link URL</label></td><td><input type="url" required class="inputRight" id="linkURL" placeholder="http://meljones.info/" autocomplete="on" size="40" /></td></tr><tr><td></td><td><button onclick="editLink();">Amend Link!</button></tr></table></div></form></td><td><table><tr><td><h3>Output: </h3><p>Not Done Yet!</p></td><td><p id="outputP"></p></td></tr><tr><td>HTML:</td><td><textarea value="" id="taHTMLoutput" readonly placeholder="The HTML code for the Link will appear here!"></textarea></td></tr></table></td></tr></table></div></div></body></html> Thanks!
  11. Oops! Changed that and the link!I mean that when I press amend link, I dont want it to clear the values of the inputs. It doesn't reload. Just clears them on click.
  12. HiI would like to stop a form resetting (clearing the values the visitor entered) but have found no such reference to it. Is there a way with Javascript? Its for this little practice webpage thing im trying to make successfully:Link MakerCurrent Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Link Maker!</title><style>/*...*/</style><script>function editLink(){ var lText= document.getElementById('linkText'); var lURL= document.getElementById('linkURL'); var taValue= document.getElementById('taHTMLoutput'); function changeHTML() { return "<a href=\"" + lURL.value + "\">" + lText.value + "</a>"; }; taValue.value= changeHTML();}</script></head><body><div id="uberContainer"><div id="headerContainer"><h1>Welcome!</h1></div><div id="mainContainer"><table align="center"><tr><td><form style="border:1; border:#666"><legend><h3>Link Details</h3></legend><div id="formContainer"><table><tr><td><label for="linkText">Link Text</label></td><td><input class="inputRight" id="linkText" autofocus="autofocus" placeholder="Mel Jones Photography Ltd." required size="40" type="text" autocomplete="on" /></td></tr><br /><tr><td><label for="linkURL">Link URL</label></td><td><input type="url" required class="inputRight" id="linkURL" placeholder="http://meljones.info/" autocomplete="on" size="40" /></td></tr><tr><td></td><td><button onclick="editLink();">Amend Link!</button></tr></table></div></form></td><td><table><tr><td><h3>Output: </h3><p>Not Done Yet!</p></td><td><p id="outputP"></p></td></tr><tr><td>HTML:</td><td><textarea value="" id="taHTMLoutput" readonly placeholder="The HTML code for the Link will appear here!"></textarea></td></tr></table></td></tr></table></div></div></body></html> Following from: Change Value - Textarea
  13. danman97

    alert notation

    Edit: Didnt see that post above!Hmm... Could you usealert(div#mydiv2.getAttribute('style'));or maybe create it as a variable likealert(myvar.getAttribute('style'));Dont take my word for it because I am quite new to Javascript ;P
  14. Yes, I would also like to know!I think it will probably use javascript, sessionStorage, etc to record what track and how far through, etc, etc but thats all I can think of really (and no, I have no idea how to do it! ;P)
  15. Ok. It half works now. Just cant get it to show the actual values of the fields! <html><title>Link Maker!</title><script>function editLink(){ var lText= document.getElementById('linkText'); var lURL= document.getElementById('linkURL'); var taValue= document.getElementById('taHTMLoutput'); function changeHTML() { return "<a href=\"" + lURL + "\">" + lText + "</a>"; }; taValue.value= changeHTML();}</script></head><body><div id="uberContainer"><div id="mainContainer"><table align="center"><tr><td><form style="border:1; border:#666"><legend><h3>Link Details</h3></legend><div id="formContainer"><table><tr><td><label for="linkText">Link Text</label></td><td><input class="inputRight" id="linkText" autofocus="autofocus" placeholder="Mel Jones Photography Ltd." required size="40" type="text" autocomplete="on" /></td></tr><br /><tr><td><label for="linkURL">Link URL</label></td><td><input type="url" required class="inputRight" id="linkURL" placeholder="http://meljones.info/" size="40" /></td></tr><tr><td></td><td><button onclick="editLink();">Amend Link!</button></tr></table></div></form></td><td><table><tr><td><h3>Output: </h3><p>Not Done Yet!</p></td><td><p id="outputP"></p></td></tr><tr><td>HTML:</td><td><textarea value="changeHTML();" id="taHTMLoutput" readonly placeholder="The HTML code for the Link will appear here!"></textarea></td></tr></table></td></tr></table></div></div></body></html> Do I need to add '.value' to the variables?e.g.:function changeHTML() { return "<a href=\"" + lURL.value + "\">" + lText.value + "</a>"; };
×
×
  • Create New...