JavaScript - Remove No Image Icon In Javascript List (simple!)
I am asking a pretty simple question, but you got to start learning somewhere, you know! Anyway, I have implemented a script that resizes images into small thumbs on the left side of a page and shows the full size image on the right when the user click on a thumb. It works well. However, I have a possible 10 thumbs on theleft and my database that feeds this does not always have 10 images. Since I re-use the page for mutiple listings, I need to find a way to disable the broken image link for listings that don't have 10 thumbs. I have attached a picture of what it looks like.
Here is the script: Code: #jgal { list-style: none; width: 200px; } #jgal li { opacity: .5; float:left; display: block; height:60px; width:60px; overflow:hidden; background-position: 50% 50%; cursor: pointer; border: 3px solid #fff; outline: 1px solid #ddd; margin-right: 14px; margin-bottom: 14px; } #jgal li img { height:60px; width:auto; } #jgal li.active img { display: block; } #jgal li.active, #jgal li:hover { outline-color: #bbb; opacity: .99 /* safari bug */ } /* styling without javascript */ #gallery { list-style: none; display: block; } #gallery li { float: left; margin: 0 10px 10px 0; } </style> <!--[if lt IE 8]> <style media="screen,projection" type="text/css"> #jgal li { filter: alpha(opacity=50); } #jgal li.active, #jgal li:hover { filter: alpha(opacity=100); } </style> <![endif]--> <script type="text/javascript">document.write("<style type='text/css'> #gallery { display: none; } </style>");</script> <!--[if lt IE 6]><style media="screen,projection" type="text/css">#gallery { display: block; }</style><![endif]--> <script type="text/javascript"> var gal = { init : function() { if (!document.getElementById || !document.createElement || !document.appendChild) return false; if (document.getElementById('gallery')) document.getElementById('gallery').id = 'jgal'; var li = document.getElementById('jgal').getElementsByTagName('li'); enlargedImg = document.createElement('img'); document.getElementById('jgal').parentNode.insertBefore(enlargedImg,document.getElementById('jgal').nextSibling); enlargedImg.src = li[0].getElementsByTagName('img')[0].src; li[0].className = 'active'; for (i=0; i<li.length; i++) { li[i].style.backgroundImage = 'url(' + li[i].getElementsByTagName('img')[0].src + ')'; li[i].style.backgroundRepeat = 'no-repeat'; li[i].title = li[i].getElementsByTagName('img')[0].alt; gal.addEvent(li[i],'click',function() { var im = document.getElementById('jgal').getElementsByTagName('li'); for (j=0; j<im.length; j++) { im[j].className = ''; } this.className = 'active'; enlargedImg.src = this.getElementsByTagName('img')[0].src; }); } }, addEvent : function(obj, type, fn) { if (obj.addEventListener) { obj.addEventListener(type, fn, false); } else if (obj.attachEvent) { obj["e"+type+fn] = fn; obj[type+fn] = function() { obj["e"+type+fn]( window.event ); } obj.attachEvent("on"+type, obj[type+fn]); } } } gal.addEvent(window,'load', function() { gal.init(); }); And then my list basically looks like this: Code: <ul id="gallery"> <li><img src="images/details/<?php echo $row_WADAitems['ItemThumb5']; ?>" alt="<?php echo $row_WADAitems['ItemDesc5']; ?>"></li> <li><img src="images/details/<?php echo $row_WADAitems['ItemThumb6']; ?>" alt="<?php echo $row_WADAitems['ItemDesc6']; ?>"></li> <li><img src="images/details/<?php echo $row_WADAitems['ItemThumb7']; ?>" alt="<?php echo $row_WADAitems['ItemDesc7']; ?>"></li> <li><img src="images/details/<?php echo $row_WADAitems['ItemThumb8']; ?>" alt="<?php echo $row_WADAitems['ItemDesc8']; ?>"></li> <li><img src="images/details/<?php echo $row_WADAitems['ItemThumb9']; ?>" alt="<?php echo $row_WADAitems['ItemDesc9']; ?>"></li> <li><img src="images/details/<?php echo $row_WADAitems['ItemThumb10']; ?>" alt="<?php echo $row_WADAitems['ItemDesc10']; ?>"></li> <li><img src="images/details/<?php echo $row_WADAitems['ItemThumb11']; ?>" alt="<?php echo $row_WADAitems['ItemDesc11']; ?>"></li> <li><img src="images/details/<?php echo $row_WADAitems['ItemThumb12']; ?>" alt="<?php echo $row_WADAitems['ItemDesc12']; ?>"></li> <li><img src="images/details/<?php echo $row_WADAitems['ItemThumb13']; ?>" alt="<?php echo $row_WADAitems['ItemDesc13']; ?>"></li> <li><img src="images/details/<?php echo $row_WADAitems['ItemThumb14']; ?>" alt="<?php echo $row_WADAitems['ItemDesc14']; ?>"></li> </ul> So as you can see, if I don't have an image in the database that it pulls from, I get that icon for a broken image link. How can I remove that icon so it doesn't show the no image icon? Many thanks! Similar TutorialsI have the following code. I am trying to add an item in the unorderedlist sing javascript when. the new list item is added when the checkbox is checked. And iam trying to remove the corresponding list item when the checkbox is unchecked. Is it possible? Any help from the web gurus will be greatly appretiated. Code: <html> <head> <title>Insert title here</title> <script type="text/javascript" language="JavaScript"> function Addlistitem(list_id) { var chname = document.getElementById(list_id).name; if (document.getElementById(list_id).checked == true) { var element = chname; var container = document.getElementById('myList'); var new_element = document.createElement('li'); new_element.innerHTML = element; container.insertBefore(new_element, container.firstChild); document.getElementById('newElement').value = ""; } else { alert("its unchecked"); //need help here to delete the added list item when its corresponding checkbox is unchecked. } } </script> </head> <body> <form name="form1"/> <input type="checkbox" name="ch1" id="c1" onclick="JavaScript:Addlistitem('c1');" value="10" /> <input type="checkbox" name="ch2" id="c2" onclick="JavaScript:Addlistitem('c2');" value="11" /> <input type="checkbox" name="ch3" id="c3" onclick="JavaScript:Addlistitem('c3');" value="12" /> <input type="checkbox" name="ch4" id="c4" onclick="JavaScript:Addlistitem('c4');" value="13" /> <input type="checkbox" name="ch5" id="c5" onclick="JavaScript:Addlistitem('c5');" value="14" /> <input type="checkbox" name="ch6" id="c6" onclick="JavaScript:Addlistitem('c6');" value="15" /> <input type="checkbox" name="ch7" id="c7" onclick="JavaScript:Addlistitem('c7');" value="16" /> <ul id="myList"> </ul> </form> </body> </html> Hello, I have a tool in my app where a user can perform a search, and it will use AJAX to deliver the results into a small box, in JSON format. When a user submits a search, a spinning gif will appear as the query is running. A javascript function is then meant to remove the gif and display the results once ready. In IE, however, this fails to happen, and the gif is locked in place, preventing the results from being displayed. I have no experience with javascript and am a bit unsure what to do. Tried to use IE's script debugger, but got totally confused. The script is much longer than this, but I think this is the problematic area: Code: 'beforeSend': function(r) { ul.find('li').remove(); ul.html('<li class="center"><img src="/images/ajax-loader.gif" /></li>'); }, 'success': function(r) { ul.find('li').remove(); h = '' $(r).each(function(k,r0){ h = h + '<li data-id="'+r0.value+'" data-icon_url="'+r0.icon_url+'">'+r0.label+'</li>'; }); For some reason, in IE only, it will clear the contents and display the gif upon submitting a search. But then it won't clear the gif and display the results. Any ideas? I would be so appreciative. Thank you. Greg Hi, I have a php script that gets all images in my directory and outputs them as gallery[0]=firstimage.jpg, [1], [2], ... The php script is supposed to work with the javascript, so to cover all angles here is the php Code: <? //PHP SCRIPT: getimages.php Header("content-type: application/x-javascript"); //This function gets the file names of all images in the current directory //and ouputs them as a JavaScript array function returnimages($dirname=".") { $pattern="(\.jpg$)|(\.jpeg$"); //valid image extensions $files = array(); $curimage=0; if($handle = opendir($dirname)) { while(false !== ($file = readdir($handle))){ if(eregi($pattern, $file)){ //if this file is a valid image //Output it as a JavaScript array element echo 'gallery['.$curimage.']="'.$file .'";'; $curimage++; } } closedir($handle); } return($files); } echo 'var gallery=new Array();'; //Define array in JavaScript returnimages() //Output the array elements containing the image file names ?> Then this javascript uses the array for a slideshow, only I want to list each image as a small thumbnail. This will allow me to view the images on my webserver much more eye friendly. Code: <script type="text/javascript"> var curimg=0 function rotateimages(){ document.getElementById("slideshow").setAttribute("src", "images/"+gallery[curimg]) curimg=(curimg<gallery.length-1)? curimg+1 : 0 } window.onload=function(){ setInterval("rotateimages()", 2500) } </script> <div style="width: 170px; height: 160px"> <img id="slideshow" src="images/bear.gif" /> </div> I'm not sure how to go about listing all the images. I was thinking about using definition lists and only selecting the last 10 images. I can insert images into the definition description so I thought that was my best shot. I get stuck on choosing the images from the array, I attempt something like the following Code: <img src="gallery[gallery.length-11]" /> </dd> But that looks for a file, not the array. I then modified the script to get me the most recent images (if I were to add/remove images). Does this look correct? Code: <script type="text/javascript"> var curimg=0 function newestimg(){ document.getElementById("largethumb").setAttribute("src", "images/"+gallery[curimg]) curimg=(curimg<gallery.length-1)? gallery.length-1 : curimg } </script> I am hoping you guys can help me with this issue. What I am trying to do is fairly simple, depending on what option you select in the menu I want the picture to change to different picture. The code that I posted below works perfectly except for one problem. I need the option value to display the color name, and not have the image code in it. I have researched ways to do this without having to use "value" but I just can't find one that works. Can someone please help me? Thanks in advance for any help given! Code: function changeimg(){ document.getElementById('colors').src=document.getElementById('color_dropdown_options').value } Code: <label> <select name="color" class="dropdown_options" id="color_dropdown_options" onchange="changeimg()"> <option value="/images/thumbnails/image1.jpg">White</option> <option value="/images/thumbnails/image2.jpg">Blue</option> <option value="/images/thumbnails/image3.jpg">Green</option> </select> </label> Code: <div id="display"><img src="/images/thumbnails/image1.jpg" width="270" height="382" alt="" id="colors" /> I'm trying to delete a item in a list. I'm getting a method not allowed error in IE8. Code: var selectOptions = document.getElementById('id_employees_cbo'); for (var i=0; i<selectOptions.options.length; i++) { if (selectOptions.options[i].selected == true) { selectOptions.options[i].remove(); break; } } Is there another way to do this? Thanks Hello all, Essentially what I am trying to get without much success on the issue is this: I want an icon in my template that, when you click on that certain icon (image), a drop down menu appears. You know when you click the file option in your browser's toolbar, and a drop down menu appears? It can be just like that, but instead of save as and open, links will be there to places within our intranet opened in a new window. This has to work for IEX 7+ because that's all our company decides to use. I tried to submit a chang erequest for them to move to a better CSS/Javascript supportive browser such as Opera, Firefox, Google Chrome... but they're way too fixed on IEX for some odd reason. I am obliged for any help on this. *edit* colors dont matter. It can be the default colors used in a basic drop down menu. I figure javascript would have more options though. This is the code that I have:- Code: ListItem[1] = new Option("A List Item", "listitem1"); ListItem[1].style.display = "none"; The first line creates a new entry in the list, I am wanting the second line to remove the same item but it doesn't work. I have tried this:- Code: ListItem[1] = new Option(""); But that leaves a blank line entry in the list Cheers Daniel. Hi guys i'm new to the world of programming and have been watching some videos on youtube by thenewboston to get to know Java. In one of his tutorials he shows you how to make a basic calculator but i wanted to improve it by adding the option to choose which operation you want to perform. However not being familiar with code i cannot think of a way to put it so that it is error free.I do also have a seperate class file which coresponds with the second paragraph.The errors appear in the if statements because of the characters * / - +. I am currently using eclipse to write my code as it is very useful for showing you your mistakes. Thanks in advance. Code: Scanner tut7 = new Scanner(System.in); double fnum, snum, answer; System.out.println("Enter First Number Please:"); fnum = tut7.nextDouble(); System.out.println("Enter Second Number Please:"); snum = tut7.nextDouble(); Scanner opinput = new Scanner(System.in); Operation OperationObject = new Operation(); System.out.println("Enter What Operation You Want to Perform: "); String oper = opinput.nextLine(); OperationObject.calc(oper); if (oper = * ){ answer = fnum * snum; System.out.print("The Answer is: "); System.out.println(answer); }else{ if (oper = / ){ answer = fnum / snum; System.out.print("The Answer is: "); System.out.println(answer); }else{ if (oper = + ){ answer = fnum + snum; System.out.print("The Answer is: "); System.out.println(answer); }else{ if (oper = - ){ answer = fnum - snum; System.out.print("The Answer is: "); System.out.println(answer); }else{ System.out.println("Invalid Operation!!!"); } } } Hello, I am new to Javascript. I copied this script from the web, but I get an error at this line: parent.removeChild(child); The error says "Invalid argument". Any suggestions are greatly appreciated. Code: <div id="parent" align=center> <form name=mainfrm method=post> <script language="JavaScript"> function doDelete(str1,str2) { var parent = document.getElementById(str1); var child = document.getElementById(str2); parent.removeChild(child); alert ("box removed"); } </script> <br><br> <table> <td class=stdbut1 onmouseover="this.className='stdbut1on'" onClick="doDelete('parent','child');" onmouseout="this.className='stdbut1'">Delete Box</td> </table> <br><br> <div id="child" class=titlebox1>Box</div> </form> </div> How do I show the default icon for pdf, doc, etc... else show the image? Code: Show the default icon for pdf, doc, etc... else show image. Default icon: '<img alt="" src="images/icons/' + sIcon + '.gif" width="16" height="16" border="0"><\/a>' + The image: '<img alt="" src="' + fileUrl.replace( /'/g, '\\\'') + '" height="36" border="0"></a>' + Attempted javascript onError but only certain browsers support that or it's my code. Code: '<img alt="" src="' + fileUrl.replace( /'/g, '\\\'') + '" height="36" border="0" onerror="this.src=images/icons/' + sIcon + '.gif"></a>' + Any ideas? Hi, I'm trying to integrate an address finder (http://www.craftyclicks.co.uk/) into my shopping cart (OsCommerce). I can get it to work but I need to add my own functionality. I'm not very experienced with JavaScript and my head has entered an infinite loop by now. The problem is that the address finder script can change the selected country in a drop-down list depending on the postcode entered by the user (using the onblur event handler). What I need it to do is to remove all other countries depending on the postcode. I can get it to remove all other countries but how do i return to the original list of countries when the postcode is changed again? Once all other counties are removed, the drop-down list will obviously only have one option left... I guess the question is also how does a function remember what it has done before, when it is called again? I have written this short test script as it is easier to work with than the craftyclicks oscommerce contribution: 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> <title>HTML Template</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta name="description" content="" /> <meta name="keywords" content="" /> <script type="text/javascript"> //<![CDATA[ function store(element) { // store values var cl = element; var text_list = new Array(); var value_list = new Array(); var length = cl.length; for (var foo=0; foo<length; foo++) { text_list[foo] = cl.options[foo].text; value_list[foo] = cl.options[foo].value; alert("text array " + foo + " " + text_list[foo]); alert("value array " + foo + " " + value_list[foo]); } populate(cl, text_list, value_list); } function populate(element, text, value) { // populate options with previously stored values var cl = element; var length = cl.length; cl.options.length=0; for (var bar=0; bar<length; bar++) { cl.options[bar]= new Option(text[bar], value[bar], false, false); } } function crafty_set_country(code) { var cl = document.getElementById('select'); store(cl); for (var i=0; i<cl.length; i++) { if (cl.options[i].value == code) { alert(cl.options[i].value + " found"); var value = cl.options[i].value; var text = cl.options[i].text; cl.options.length=0; cl.options[0]=new Option(text, value, true, true); /* for (var j=0; j<cl.length; j++) { alert("second loop " + cl.options[j].text); if (cl.options[i].value != code) { cl.options[j] } } */ } else { alert(cl.options[i].value); } } } //]]> </script> </head> <body> <form> <select id="select"> <option value="10">ten</option> <option value="20">twenty</option> <option value="30">thirty</option> <option value="40">fourty</option> <option value="50">fifty</option> <option value="60">sixty</option> </select> <input type="button" value="remove" name="button" onClick="crafty_set_country(50)"> <input type="button" value="repopulate" name="button" onClick="crafty_set_country(100)"> </form> </body> </html> Many thanks! Martin Is there a way to remove (not disable and not delete) an option in a "select" list, and restore it later when needed? I have a form with many huge lists ("select" with many "options") that depend on eachother. I am dynamically updating the form through server, and wish to update the list values by sending a mask string. This way I could remove and restore the options without the need to pass the whole list again. I tried many ways but none work: * option.diabled="disabled" is not good because it is still shown * option.style.visibility='hidden' is not good because it is still taking a row * option=null is not good because I will not be able to restore it I need a method similar to the following one for remove/add fields in a form: remove: <field>.style.display='none'; resto <field>.style.display=block'; Thank you!!! Hi, Suppose I have this: Code: <a href="#" class="play" onclick="Audio('lol.mp3')"> As you see, when a user will click on the link, it will play an audio. Good! I want to know if I have another button, let's say <button>Remove</button>, how can I disable the "onClick" event on the link above? And also when clicking on a third button <button>Add</button>again, it will enable the function again to work? NOTE: I do not want an HTML5 audio Stop button. This is different. I just want to know how to enable and disable function event. Thank! Hello everybody, new here. I'm a complete JavaScript newbie, all I know is some HTML, CSS and little jQuery. Don't be so harsh :P I own and run a forum on a free software called Forumotion. Since these people like getting a lot of revenue, they added a metatag that makes IE8 work like IE7. Here it is. Code: <!-- BEGIN meta_emulate_ie7 --> <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> <!-- END meta_emulate_ie7 --> This works on only some pages on my forum. However, since we use a lot of CSS and JavaScript codes that IE7 doesn't support (but IE8 does), these pages are completely screwed up. Since they don't offer template editing for some versions (in which this tag can be found), I cannot simply delete this tag (unfortunately). I have come here to ask if there's any way to inhibit, remove, delete and destroy that stupid metatag which is screwing my forum up using JavaScript, jQuery, AJAX, or any other way (except PHP, since it's disallowed...) to do so. Any ideas? Any help will be absolutely appreciated. Thanks a bunch. I downloaded a popup datepicker from javascriptkit.com. All great but can't take the time out of the footer. I only want the date to show, and once selected, I would like the field to be filled with "Day, Date, Month, Year" (no time). Code is as follows: Code: function show_calendar(str_target, str_datetime) { var arr_months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]; var week_days = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"]; var n_weekstart = 1; // day week starts from (normally 0 or 1) var dt_datetime = (str_datetime == null || str_datetime =="" ? new Date() : str2dt(str_datetime)); var dt_prev_month = new Date(dt_datetime); dt_prev_month.setMonth(dt_datetime.getMonth()-1); var dt_next_month = new Date(dt_datetime); dt_next_month.setMonth(dt_datetime.getMonth()+1); var dt_firstday = new Date(dt_datetime); dt_firstday.setDate(1); dt_firstday.setDate(1-(7+dt_firstday.getDay()-n_weekstart)%7); var dt_lastday = new Date(dt_next_month); dt_lastday.setDate(0); // html generation (feel free to tune it for your particular application) // print calendar header var str_buffer = new String ( "<html>\n"+ "<head>\n"+ " <title>Calendar</title>\n"+ "</head>\n"+ "<body bgcolor=\"White\">\n"+ "<table class=\"clsOTable\" cellspacing=\"0\" border=\"0\" width=\"100%\">\n"+ "<tr><td bgcolor=\"#4682B4\">\n"+ "<table cellspacing=\"1\" cellpadding=\"3\" border=\"0\" width=\"100%\">\n"+ "<tr>\n <td bgcolor=\"#4682B4\"><a href=\"javascript:window.opener.show_calendar('"+ str_target+"', '"+ dt2dtstr(dt_prev_month)+"'+document.cal.time.value);\">"+ "<img src=\"prev.gif\" width=\"16\" height=\"16\" border=\"0\""+ " alt=\"previous month\"></a></td>\n"+ " <td bgcolor=\"#4682B4\" colspan=\"5\">"+ "<font color=\"white\" face=\"tahoma, verdana\" size=\"2\">" +arr_months[dt_datetime.getMonth()]+" "+dt_datetime.getFullYear()+"</font></td>\n"+ " <td bgcolor=\"#4682B4\" align=\"right\"><a href=\"javascript:window.opener.show_calendar('" +str_target+"', '"+dt2dtstr(dt_next_month)+"'+document.cal.time.value);\">"+ "<img src=\"next.gif\" width=\"16\" height=\"16\" border=\"0\""+ " alt=\"next month\"></a></td>\n</tr>\n" ); var dt_current_day = new Date(dt_firstday); // print weekdays titles str_buffer += "<tr>\n"; for (var n=0; n<7; n++) str_buffer += " <td bgcolor=\"#87CEFA\">"+ "<font color=\"white\" face=\"tahoma, verdana\" size=\"2\">"+ week_days[(n_weekstart+n)%7]+"</font></td>\n"; // print calendar table str_buffer += "</tr>\n"; while (dt_current_day.getMonth() == dt_datetime.getMonth() || dt_current_day.getMonth() == dt_firstday.getMonth()) { // print row heder str_buffer += "<tr>\n"; for (var n_current_wday=0; n_current_wday<7; n_current_wday++) { if (dt_current_day.getDate() == dt_datetime.getDate() && dt_current_day.getMonth() == dt_datetime.getMonth()) // print current date str_buffer += " <td bgcolor=\"#FFB6C1\" align=\"right\">"; else if (dt_current_day.getDay() == 0 || dt_current_day.getDay() == 6) // weekend days str_buffer += " <td bgcolor=\"#DBEAF5\" align=\"right\">"; else // print working days of current month str_buffer += " <td bgcolor=\"white\" align=\"right\">"; if (dt_current_day.getMonth() == dt_datetime.getMonth()) // print days of current month str_buffer += "<a href=\"javascript:window.opener."+str_target+ ".value='"+dt2dtstr(dt_current_day)+"'+document.cal.time.value; window.close();\">"+ "<font color=\"black\" face=\"tahoma, verdana\" size=\"2\">"; else // print days of other months str_buffer += "<a href=\"javascript:window.opener."+str_target+ ".value='"+dt2dtstr(dt_current_day)+"'+document.cal.time.value; window.close();\">"+ "<font color=\"gray\" face=\"tahoma, verdana\" size=\"2\">"; str_buffer += dt_current_day.getDate()+"</font></a></td>\n"; dt_current_day.setDate(dt_current_day.getDate()+1); } // print row footer str_buffer += "</tr>\n"; } // print calendar footer str_buffer += "<form name=\"cal\">\n<tr><td colspan=\"7\" bgcolor=\"#87CEFA\">"+ "<font color=\"White\" face=\"tahoma, verdana\" size=\"2\">"+ "Time: <input type=\"text\" name=\"time\" value=\""+dt2tmstr(dt_datetime)+ "\" size=\"8\" maxlength=\"8\"></font></td></tr>\n</form>\n" + "</table>\n" + "</tr>\n</td>\n</table>\n" + "</body>\n" + "</html>\n"; var vWinCal = window.open("", "Calendar", "width=200,height=250,status=no,resizable=yes,top=200,left=200"); vWinCal.opener = self; var calc_doc = vWinCal.document; calc_doc.write (str_buffer); calc_doc.close(); } // datetime parsing and formatting routimes. modify them if you wish other datetime format function str2dt (str_datetime) { var re_date = /^(\d+)\-(\d+)\-(\d+)\s+(\d+)\:(\d+)\:(\d+)$/; if (!re_date.exec(str_datetime)) return alert("Invalid Datetime format: "+ str_datetime); return (new Date (RegExp.$3, RegExp.$2-1, RegExp.$1, RegExp.$4, RegExp.$5, RegExp.$6)); } function dt2dtstr (dt_datetime) { return (new String ( dt_datetime.getDate()+"-"+(dt_datetime.getMonth()+1)+"-"+dt_datetime.getFullYear()+" ")); } function dt2tmstr (dt_datetime) { return (new String ( dt_datetime.getHours()+":"+dt_datetime.getMinutes()+":"+dt_datetime.getSeconds())); } This is called with: Code: <html lang="en"> <head> <script language="JavaScript" src="ts_picker.js"> </script> </head> <body> <form name="tstest"> <input type="Text" name="timestamp" value=""> <a href="javascript:show_calendar('document.tstest.timestamp', document.tstest.timestamp.value);"><img src="cal.gif" width="16" height="16" border="0" alt="Click Here to Pick up the timestamp"></a> </form> </body> </html> Thanks for any help!!! Ruth No Jquery plz As you can see that I want to remove this advertisement area (denoted by 1) via some java code. Now one can observe that this advert is hosted in the 'main-content' id & wrapped in 'inner' class. One cannot remove/hide id but CAN remove/hide the class which also will remove/hide the advert area placed within this class. Hi everybody, I have this File Upload control, whereby the user is granted a limit of 5 uploads. And so, the user clicks on "Attach Another File", and decides to attach a file ONLY in the first File Upload control. My problem is, I want the user to be able to click on an "X" beside every File Upload control, so that it will close those unnecessary (or unused) FIle Upload controls. How do I edit my code in JAVASCRIPT? Please advise. 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> <title></title> <script language="javascript" type="text/javascript"> var fileCount = 1; function addOneFile() { ++fileCount; var div = document.getElementById("showFile"+fileCount); if ( div != null ) div.style.display = "block"; } </script> <style type ="text/css"> .style37 { color: Black; margin-left: 99px; } </style> </head> <body> <table cellpadding="5"> <tr> <td style="vertical-align: top"> Attachment: </td> <td> <input type="file" name="attachment" id="attachment" style="width:230px" /> <div id="showFile2" style="display: none;"> <input name="file2" type="file" /> </div> <div id="showFile3" style="display: none;"> <input name="file3" type="file" /> </div> <div id="showFile4" style="display: none;"> <input name="file4" type="file" /> </div> <div id="showFile5" style="display: none;"> <input name="file5" type="file" /> </div> <br /> <a href="javascript:addOneFile();" class="style37">Attach another File</a> <br /> (Restricted to 5 uploads) </td> </tr> </table> </body> </html> I want to have another go at Javascript. I have several books on the subject but I find that my eyesight is a major problem. Therefore I want to try an on-line solution, preferably free. I have Googled, but there are so many that I am almost dizzy with the choices. Perhaps someone could recommend one. Not too fussy visually. My knowledge is VERY basic. Frank For example ,There is a "Link" called "go to view" at the bottom of the my page, which is redirecting to http://localhost/test.php . if we use $_SERVER['HTTP_REFERER'] in test.php page It will display the url of the page from which link was clicked. The problem is this my URL can be seen at the target page. This needs to be avoided. How can i do this using javascript ? I imagine this would be very simple for someone who knows javascript. I want to have three fields. First field is "posted speed limit", second field is "actual speed" and third field will be the output field. All the script needs to do it subtract the posted speed from the actual speed and add a ZERO to the end; which is the amount of the speeding ticket. The minimum fine is $100, however. So, 5 miles over the speed limit would be $100 (minimum value) 15 miles over the speed limit would be $150 (add a zero) 35 miles over the speed limit would be $350. etc. I know very little Javascript, if anyone could help me out with this, I'd appreciate it. Thanks, Sean |