JavaScript - Display Text After Time
hi all,
im looking for a script that does the following when the page loads "text1" is displayed. then on the next line 2 seconds later "text2" is displayed and test1 is still displayed. and i need this to go to 5 lines so the final project should look like --- text1 text2 text3 text4 text5 thanks Similar TutorialsHello I am trying to do something similar to this post http://www.codingforums.com/showthread.php?t=168903 except I need it to be dependent on the hour and minute. Background: I am trying to create a schedule website, the schedule has say 20 items and I want it to display the current "active" event in the schedule, 1 previous event and 3 future events so a total of 5 items from the schedule. An event can range from 30 minutes to 2 hours long, so simply using the above code will not work. It needs to take the minutes into consideration as well. Let me know if you have additional questions. EDIT: 17-Mar-12 @ 12:37PM I would rather not use a bunch of if statements. (http://www.codingforums.com/showthread.php?t=250358) The schedule could change mid day so having to go through and edit a bunch of if statements would not be ideal Pretty simple, I just want to display a <div> after say 20 seconds or any predefined value. Ideally with jQuery
Hi! First post here! Would really appreciate some help on a javascript that would display the time elapsed since a particular visitor last visited my webpage, using cookies. So basically it should show something like: "You last visited my page 2 days & 12 mins ago!" I've a little background in java but none in javascript... Thanks so much! I was trying to display time of last visit along with login name.. can someone help me on this pls? How can I draw a cookie where number of chocolate chips represents the number of seconds and the number of bites represents the number of minutes. I want to show the passage of time on a clock that looks like items are being added to the display according to the number of seconds and minutes. Maybe using a mouse input aswell! Please guide.:confused: I use the Processing Software Hi, I want to display my listings like they do he http://www.ticketnetwork.com/performers/concerts/a.aspx The code on my end calling the third party service looks like this: <script language="javascript" type="text/javascript"> document.write('<script language="javascript" src="http://###########.com/?bid='+####+'&sitenumber='+#+'&tid=event_names&pcatid=2&showcats=true&title=Concerts Tickets"></' + 'script>'); </script> How do I make it only display one letter at a time? I believe some variation on the sort method might work... Hey guys. So I've been learning PHP and MySQLi for the past few weeks and it's going brilliantly! I intend to start learning JS over the Xmas holidays, but right now I only have a very basic knowledge of it. I was just wondering if someone could point me in the right direction on how to do this, as I think i should be pretty easy. After someone changes something in the admin area [e.g. the position of an item] I want to be able to have a small div display at the top of the screen saying something like "Position Updated!" and then have it fade away after 2-3 seconds. Just wondering if there's a fairly easy way to do this, or would I have to go get something like MooTools, etc.? Thanks a lot! I have this code which converts Fahrenheit to Celsius. Now, I have to have a counter that displays the amount of times I have made a conversion. I have no clue how to do this. This is the initial code:
Code: <html> <head> <script type="text/javascript"> /* Converts given centigrade in one text box to farenheit in another */ function convert1 () { document.getElementById("output").value = document.getElementById("input").value*1.8+32; } </script> </head> <body> <p>Then enter the input and view the output</p> <input type="text" size="15" id="input"> <input type="button" value=" ==> " onclick="convert1()"> <input type="text" size="15" id="output"> </body> </html> I don't know how to approach this so I tried different things.... Code: tml> <head> <script type="text/javascript"> /* Converts given centigrade in one text box to farenheit in another */ function convert1 () { document.getElementById("output").value = document.getElementById("input").value*1.8+32; } function counter() { if (function convert1().onclick==true) {count++;} } </script> </head> <body> <p>Then enter the input and view the output</p> <input type="text" size="15" id="input"> <input type="button" value=" ==> " onclick="convert1()"> <input type="text" size="15" id="output"> </body> </html> but then I did some research and it said I couldn't do that.... so I tried this: Code: <html> <head> <script type="text/javascript"> /* Converts given centigrade in one text box to farenheit in another */ var count=0; function documentClick() { document.getElementById('clicked').value = ++clickCount } document.onclick = documentClick; function convert1 () { document.getElementById("output").value = document.getElementById("input").value*1.8+32; } </script> </head> <body> <p>Then enter the input and view the output</p> <input type="text" size="15" id="input"> <input type="button" value=" ==> " onclick="convert1()"> <input type="text" size="15" id="output"> </body> </html> I think this last code is correct, the problem I have now is that I don't know how to call it to just display as text under the buttons and conversions. I'm looking for some way to display it like ("you have made"+ count+ "conversions");. No boxes or buttons, just text and I don't know how to call for this after the </script>, inside the body. I am new at all this and would appreciate any help. Thanks. It should look like this. When the site loads up, invite the user to enter their name and then display a message at the top of the document which will say< good morning, evening, or afternoon >, based on the time they access your site, welcome to <insert the name of your site> This is the question how do i do it?? My question is twofold. First, is there a way to have a javascript file display an externally hosted image when opened with a browser? I mean such a way where the URL of the javascript file can be referenced by an html document and display an image? Furthermore, is there a way to have this be a different image depending on the time of day and timezone of the user, specifically one image in the morning and a different image in the evening? I apologize if I posted this in the wrong section, but I wasn't sure where else this could go. time validation for text box valid time in 24 hours format with no seconds my textboxes have same name and id with array i am alerting the text box value onblur.It shows only the first text box value I want to alert for every text box if value is not a number Code: <?php session_start(); if (!$_SESSION['uname']) header("Location:login.php"); ?> <html><head><title>Attendance sheet</title> <link rel="stylesheet" href="att_style.css" type="text/css" > <script type="text/javascript"> function IsNumber(strAlert) { //alert(strAlert); var txtb = document.getElementById('in_time[]').value; //for (var i = 0; i < txtb.length; i++) { //var txtv = txtb[i].value; alert(txtb); //} } </script> </head> <body> <?php $cnn = mysql_connect("localhost","root",""); mysql_select_db("time_sheet",$cnn); $dbdate = mysql_query("SELECT start_mon,end_mon FROM admin"); $dd = mysql_fetch_array($dbdate); $curmon = getdate(); $nextmonth = $curmon['mon'] + 1; $start = "2012" . "-" . $curmon['mon'] ."-". $dd['start_mon']; $end = "2012" . "-". $nextmonth ."-". $dd['end_mon']; $_SESSION['fromdate'] = $start; $_SESSION['todate'] = $end; $dateMonthYearArr = array(); $fromDateTS = strtotime($start); $toDateTS = strtotime($end); for ($currentDateTS = $fromDateTS; $currentDateTS <= $toDateTS; $currentDateTS += (60 * 60 * 24)) { $currentDateStr = date("M d",$currentDateTS); $notmysql[] = $currentDateStr; $currmysql = date("Y-m-d",$currentDateTS); $mysqlfor[] = $currmysql; } echo " No of days: " . count($mysqlfor); //Table for view if (isset($_REQUEST['sub'])) { $inti = $_POST['in_time']; $outi = $_POST['out_time']; $intime = serialize($inti); $outtime = serialize($outi); $inser = unserialize($intime); $outser = unserialize($outtime); $dbdate = mysql_query("SELECT start_mon,end_mon FROM admin"); $dd = mysql_fetch_array($dbdate); $curmon = getdate(); $nextmonth = $curmon['mon'] + 1; $dateMonthYearArr = array(); $fromDateTS = strtotime($start); $toDateTS = strtotime($end); for($b = 0; $b < count($mysqlfor); $b++) { $qry = mysql_query("SELECT * FROM timetable where date = '".$mysqlfor[$b]."' "); $ds = mysql_fetch_array($qry); if(!$qry) die(mysql_error()); $check = mysql_num_rows($qry); // print_r($inser); if($check == 0) { if($inser[$b] == "") $inser[$b] = '00:00'; if($outser[$b] == "") $outser[$b] = '00:00'; $ins = mysql_query("INSERT INTO timetable VALUES ('', '".$_SESSION['uname']."', '".$mysqlfor[$b]."', '".$inser[$b]."', '".$outser[$b]."', '') "); } else { //print_r($mysqlfor[$b]); $upd = mysql_query("UPDATE `timetable` SET `in` = '".$inser[$b]."', `out` = '".$outser[$b]."' WHERE `date` = '".$mysqlfor[$b]."' "); if(!$upd) die(mysql_error()); } } } ?> <form name="myForm" method="post" action=""> <table border="1" cellspacing="0" cellpadding="2"> <tr><th scope="row">DATE</th> <?php for ($s = 0; $s < 10; $s++) { ?> <td align="center"><?php print_r($notmysql[$s]); } ?></td></tr> <tr><th scope="row">IN</th> <?php for ($ss = 0; $ss < 10; $ss++) { ///////////////getting from DB $sele = mysql_query("SELECT * FROM timetable where date = '".$mysqlfor[$ss]."' "); $emp = mysql_num_rows($sele); ?> <td align="center"> <?php $numrows = mysql_num_rows($sele); if($numrows == 0) { ?> <input name="in_time[]" id="in_time[]" type="text" onBlur="IsNumber();" size="5"> </td> <?php } else { while($row1 = mysql_fetch_array($sele)) { ?> <input name="in_time[]" id="in_time[]" type="text" onBlur="IsNumber();" value="<?php echo $row1['in']; ?>" size="5"></td> <?php } } }?> </tr> <tr><th scope="row">OUT</th> <?php for ($v = 0; $v < 10; $v++) { ?> <td align="center"> <?php $sel2 = mysql_query("SELECT * FROM timetable where date = '".$mysqlfor[$v]."'"); $numrows = mysql_num_rows($sel2); if($numrows == 0) { ?> <input name="out_time[]" id="out_time[]" type="text" size="5"></td> <?php } else { while($row2 = mysql_fetch_array($sel2)) { ?> <input name="out_time[]" id="out_time[]" type="text" onBlur="IsNumber();" value="<?php echo $row2['out']; ?>" size="5"></td> <?php } } }?> </tr> <tr><th scope="row">Late</th><?php for ($s = 0; $s < 10; $s++) { ?> <td align="center"><input name="late_time[]" id="late_time[]" onBlur="IsNumber();" type="text" size="5"></td> <?php }?> </tr> </table> <br><br> <!-- second tab--> <?php if(count($notmysql) >= 11) { ?> <table border="1" cellspacing="0" cellpadding="2"><tr><th scope="row">DATE</th> <?php for ($st = 10; $st < 20; $st++) { ?> <td align="center"><?php print_r($notmysql[$st]); ?></td> <?php } ?></tr> <tr><th scope="row">IN</th> <?php for ($g = 10; $g < 20; $g++) { $selec = mysql_query("SELECT * FROM timetable where date = '".$mysqlfor[$g]."'"); $numrows = mysql_num_rows($selec); ?> <td align="center"> <?php if($numrows == 0) { ?> <input name="in_time[]" id="in_time[]" type="text" onBlur="IsNumber();" size="5"></td> <?php } else { while($secinrow = mysql_fetch_array($selec)) { ?> <input name="in_time[]" id="in_time[]" value="<?php echo $secinrow['in']; ?>" onBlur="IsNumber();" type="text" size="5"></td> <?php } } }?></tr> <tr><th scope="row">OUT</th> <?php for ($h = 10; $h < 20; $h++) { $select = mysql_query("SELECT * FROM timetable where date = '".$mysqlfor[$h]."'"); ?> <td align="center"> <?php $numrows = mysql_num_rows($select); if($numrows == 0) {?> <input name="out_time[]" id="out_time[]" type="text" onBlur="IsNumber();" size="5"></td> <?php } else { while($secoutrow = mysql_fetch_array($select)) { ?> <input name="out_time[]" id="out_time[]" type="text" onBlur="IsNumber();" value="<?php echo $secoutrow['out']; ?>" size="5"></td> <?php } } }?></tr> <tr><th scope="row">Late</th> <?php for ($m = 10; $m < 20; $m++) { ?> <td align="center"><input name="late_time[]" id="out_time[]" onBlur="IsNumber();" type="text" size="5"></td> <?php } ?> </tr> </table> <?php } ?> <br/><br/> <!-- Third table--> <?php if(count($notmysql) >= 21) { ?> <table border="1" cellspacing="0" cellpadding="2"> <tr> <th scope="row">DATE</th> <?php for ($tt = 20; $tt < count($notmysql); $tt++) { ?> <td align="center"><?php print_r($notmysql[$tt]); ?></td><?php } ?> </tr> <tr><th scope="row">IN</th> <?php for ($j = 20; $j < count($notmysql); $j++) { $selected = mysql_query("SELECT * FROM timetable where date = '".$mysqlfor[$j]."' "); ?> <td align="center"> <?php $numrows = mysql_num_rows($selected); if($numrows == 0) {?> <input name="in_time[]" id="in_time[]" type="text" onBlur="IsNumber();" size="5"></td> <?php } else { while($treinrow = mysql_fetch_array($selected)) { ?> <input name="in_time[]" id="in_time[]" type="text" onBlur="IsNumber();" value="<?php echo $treinrow['in']; ?>" size="5"></td> <?php } } } ?> </tr> <tr><th scope="row">OUT</th> <?php for ($k = 20; $k < count($notmysql); $k++) { $selectedr = mysql_query("SELECT * FROM timetable where date = '".$mysqlfor[$k]."'"); $numrows = mysql_num_rows($selectedr); ?> <td align="center"> <?php if($numrows == 0) { ?> <input name="out_time[]" id="out_time[]" type="text" onBlur="IsNumber();" size="5"></td> <?php } else { while($treoutrow = mysql_fetch_array($selectedr)) { ?> <input name="out_time[]" id="out_time[]" onBlur="IsNumber();" value="<?php echo $treoutrow['out']; ?>" type="text" size="5"></td> <?php } } } ?> </tr> <tr><th scope="row">Late</th> <?php for ($s = 20; $s < count($notmysql); $s++) { ?> <td align="center"> <input name="late_times[]" id="late_times[]" type="text" value="<?php ?>" size="5"></td> <?php } ?> </tr> </table> <?php } ?> <!--Table End --> <a style="float:right" href="logout.php">Logout</a> <p align="center"><input name="sub" type="submit" value="Save"></p> </form> </body> </html> Hi, I'm trying to display a time clock in input text box. The time should display in Time utilization box after clicking on START BUTTON. I tried the below code and it is not starting the time. However, I tried the javascript individually and it worked. Any help? PHP Code: <script type="text/javascript"> var seconds = 0; var minutes = 0; var hours = 0; function zeroPad(time) { var numZeropad = time + ''; while(numZeropad.length < 2) { numZeropad = "0" + numZeropad; } return numZeropad; } function countSecs() { seconds++; if (seconds > 59) { minutes++; seconds = 0; } if (minutes > 59) { hours++ minutes = 0; } document.getElementById("time_utilization").innerHTML = zeroPad(hours) + ":" + zeroPad(minutes) + ":" + zeroPad(seconds); } function startTimer() { action = window.setInterval(countSecs,1000); } </script> </head> <body> <?php include("header.php"); ?> <div class="art-content-layout"> <div class="art-content-layout-row"> <div class="art-layout-cell art-content"> <div class="art-post"> <div class="art-post-body"> <div class="art-post-inner art-article"> <form name="tracker" method="post" action="processor.php" onsubmit="return formCheck(this);"> <ul> <li class="mainForm" id="fieldBox_8"> <label class="formFieldQuestion">Start Time *</label><input readonly class=mainForm type=text name=start_time id=start_time size='30' value=''> <input type="button" id="start1_time" style="width: 100px" Value="Start Time" onClick="startTimer()"></li> <li class="mainForm" id="fieldBox_12"> <label class="formFieldQuestion">Time Utilization</label><input class=mainForm type=text name="time_utilization" id="time_utilization" size='8' value='00:00:00' ></li> <br /> <br /> <li class="mainForm"> <input id="saveForm" class="mainForm" type="submit" value="Submit" style="width : 100px"/> </li> </form> I am getting "Unknown Runtime Error at line 43". However, code has below line at link 43: Code: document.getElementById("time_utilization").innerHTML = zeroPad(hours) + ":" + zeroPad(minutes) + ":" + zeroPad(seconds); Hi Guys, I am looking for a script to change text on a page based on the time of day. From 9am - 5pm weekdays I would like the page to display 'Open', and outside of that window to display 'Closed'. I am using HTML & PHP. Any help would be greatly appreciated. Thanks, Matt I am the webmaster for the amateur radio club I am a member of. One of the pages on our newly redesigned website is a swap shop, where people can list items for sale. To keep the page from becoming too bloated and cumbersome, I stated in the header that ads would only be listed for 30 days. I found a javascript on JavaScriptKit.com that has the features I am looking for, in that it makes something disappear after a set period of time. I need help modifying it now to make a <div> disappear from the website, instead of just an image. Here is the code, with all credits shown: Code: <script> <!-- /* "Whats new?" image script- By JavaScript Kit (www.javascriptkit.com) Over 200+ free scripts here! */ //set the below to the image you wish to use as the "new" image var imagetag='<img src="../../news.gif">' var today=new Date() function expireat(expiredate){ var expire=new Date(expiredate) if (today.getTime()<=expire.getTime()) document.write(imagetag) } //--> </script> Anyone have an idea where to go after I remove the var imagetag? I know this requires setting the <div> element's visibility to "hidden" after the period of time set by the javascript. I just am not sure how to go about doing it. My website is engineered to be simple, no CMS in place. This is in the event that someone who has little to no HTML coding experience has to take over my webmaster duties in the future. Hey, I've got the following problem: I want to edit this code: <a name="fb_share" type="button_count" href="http://www.facebook.com/sharer.pp"><img src="http://blog.bastian.info/wp-content/uploads/2010/02/facebook-glossy-logo.jpg"></a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script> So that after they click the button that triggers the facebook share, 7 seconds after they click it, some text appear and the picture they click disappears. Cheers Hey guys, Im trying to figure out how to display a string of text beneath the drop down when a specific option is selected. for example: if you select 'Colors' just plain text would appear the drop down and show the list of colors 'red, blue, green, yellow' or if you select 'Fruit' the plain text shows the list of fruit "orange, banana, apple, lemon' Any ideas or can you guys point me in the right direction? I have a similar code except its when you type in a number in a textarea it would output the coressponding data. ok well here's what i want to do i have a bbcode for download links on my forum when this bbcode is parsed, it will display a link under the download link BUT only for the first 3 links so basically i would need a javascript with a counter, that will display some text if the counter is > 3 and then add +1 to the counter normally i would EASILY do this with php, but i can't (bbcodes are parsed not parsed by server on phpbb, and you can't use php code in bbcodes) And since i'm a total newbie with javascript, i need to come here and ask this stupid question :/ thanks for your help! if you still don't understand what i want to do, here is how it would look in php if i could include this code in my phpbb custom bbcode: Code: <? if (empty($compteur)) { $compteur = "1"; } if ($compteur < 4) { echo "bla blah blah"; $compteur = $compteur+1; } ?> Hi I am trying to use stoutlabs content slider on my website. I have a dummy set up here www.mattbbell.com Instead of the numbered navigation i want to have text like home, bio, contact etc The demo can be download here http://stoutlabs.com/demos/class_sli..._slider_v2.zip with all files necessary to make the dummy website you see there... From what i can tell I have to edit the sl_slider_new.js file and make it call a list of divs that i name home, bio, contact I think this is the section i need to edit but i don't know much about javascript.... Code: // -- Number nav setup if(self.options.numNavActive == true){ //create numbered navigation boxes, and insert into the 'num_nav' ul) var numItem = new Element('li', {id: 'num'+i}); var numLink = new Element('a', { 'class': 'numbtn', 'html': (i+1) }); numItem.adopt(numLink); self.options.numNavHolder.adopt(numItem); self.numNav.push(numLink); numLink.set('morph', {duration: 100, transition: Fx.Transitions.linear, link: 'ignore'}); numLink.addEvents({ 'click' : function(){ self.numPress(i); }, 'mouseenter' : function() { this.setStyle('cursor', 'pointer'); } }); //set initial number to active state if(i == self.options.itemNum){ var initNum = self.numNav[i]; initNum.addClass('active'); } } //end if num nav 'active' }); }, thanks! This is a follow up to my older thread, about tables and finding images within them. So after getting some help from "Krupski" I found myself stuck again. I'm trying to go at this rather from an other point of view, instead of getting the cell information I am now trying to get the alt text value. from within the image tag. but being a novice at this well ive hit a wall. My code so far. searches though the table finding the sad images then i want it to display the Alt-text or an other value table_id or similar. also is there a fast way of putting in Alt text like A1,2,3 B1,2,3 etc like an automated loop. (might work on this after the main problem is dealt with) Code: <html> <head> <script type="text/javascript"> var findImg = function(name) { var e = document.getElementsByTagName('img'); var i = e.length; // how many img elements total var str = ''; while (i--) { if (e[i].src.indexOf(name) != -1) // if match... str += e[i].src + '\n'; //...copy to str with a newline } alert(str); // display all matches } function searchFor(){ findImg('smiley%20sad%20Icon.jpg'); // call the function with the name to be matched } </script> </head> <body> <table width="200" border="1"> <tr Id="A"> <td Id="1"><img src="http://www.hencam.co.uk/hencam_forum//extensions/Smile/tango/face-smile.png" Alt="A1"> </td> <td Id="2"><img src="http://www.hencam.co.uk/hencam_forum//extensions/Smile/tango/face-smile.png" Alt="A2"> </td> <td Id="3"><img src="http://www.iconeasy.com/icon/thumbnails/System/Icons%20for%20Developers/smiley%20sad%20Icon.jpg" Alt="A3"></td> </tr> <tr Id="B"> <td Id="1"><img src="http://www.hencam.co.uk/hencam_forum//extensions/Smile/tango/face-smile.png" Alt="B1"></td> <td Id="2"><img src="http://www.iconeasy.com/icon/thumbnails/System/Icons%20for%20Developers/smiley%20sad%20Icon.jpg" Alt="B2"></td> <td Id="3"><img src="http://www.hencam.co.uk/hencam_forum//extensions/Smile/tango/face-smile.png" Alt="B3"></td> </tr> <tr Id="C"> <td Id="1"><img src="http://www.hencam.co.uk/hencam_forum//extensions/Smile/tango/face-smile.png" Alt="C1"></td> <td Id="2"><img src="http://www.hencam.co.uk/hencam_forum//extensions/Smile/tango/face-smile.png" Alt="C2"></td> <td Id="3"><img src="http://www.hencam.co.uk/hencam_forum//extensions/Smile/tango/face-smile.png" Alt="C3"></td> </tr> </table> <br> <input type="button" value="Search" id="Search" onClick="searchFor();"/> </body> </html> Thanks in advance anyone who can help. ~Mark j |