JavaScript - Highlighted Link Forgotten On Page Refresh
hey all,
i'm using this script below that highlights the current link clicked. My site is a horizontal scrolling site so the links just redirect to different parts of the page. My problem is is that when the page is refreshed the current link is forgotten and the home link is highlighted, even though the page stays in the right place. Is there a way to keep the current link highlighted? here's the js code: Code: $(document).ready(function(){ $('#nav a').click(function() { $('#nav a').removeClass("selected"); $(this).addClass("selected"); }); here's the html code Code: <style type="text/css"> #nav .selected { opacity:1.00;} #menu .clicked {color:black;} </style> <div id="nav"> <a href="#home" id="hlink" name="home" style="margin-left:130px">home</a> <a href="#foamo" id="flink" >foamo</a> <a href="#book" id="blink" >book</a> <a href="#portfolio" id="plink" >portfolio</a> <a href="#contact" id="clink">contact</a> </div> Thanks Similar TutorialsI forgot to append what key is actually pressed too, but not sure how? Any quick help would be appreciated. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang=en> <head> <title>Question 5</title> </head> <body> <form> Char: <input type="text" id="catch"/> <br /><br /> Keycode: <br /><textarea id="display"></textarea> </form> <script type="text/javascript"> var ip=document.getElementById("catch") ip.onkeypress=function(a) { var a=window.event || a var uc=a.charCode || a.keyCode document.getElementById("display").value=uc } </script> </body> </html> Hi everyone. I'm trying for a while to make a div with a title and a list that is highlighted with rollover. I've made a graphic to exemplify what I'm trying to make. I have tried to use the BigTarget.js and the fitted.js without any luck. Can anyone help me on this please? Thanks i have a page named pck_rates.php which contains a form that go to the page update_pck_rates.php when i press updade data button in the second page i want the first page to be refreshed to show the new data's. i want to know if i can set a name to the page pck_rates.php and after the update query in the second page i will refresh the pck_rates.php page using this name?? i don't know what is the function and how to make this idea. can anyone help me please Hello All, I am a JS newbie and I'm wondering if there a way to figure out the sentence from which a word has been highlighted. Essentially, when a user selects a word or a phrase, I should output the sentence from which it's been selected. Is this possible with JS or with any server side languages? - Pallav Hi, For the last few day's i've been searching for a js/ajax div refresh. I need a js/ajax script that refresh a div every 10 seconds or gets menu.php file and updates it. Thanks. <HEAD><TITLE>main</TITLE> <meta http-equiv="refresh" content="5;url=http://localhost/php_basic/short_pro/php/main.php"> <!--<script language="JavaScript"> var i=0; function validat() { setTimeout("moretext()",5000); alert("santosh"); } function moretext() { if(i==0) { alert(window.location); window.location.reload(); i++; } else { } } </script>--> </head> <BODY onload="validat();"> i hav written dis code to auto refresh page only once but it is refreshing after every 5 seconds. Earlier i hav wriiten meta tag but it is refreshing page after every 5 seconds & after that i hav wriiten script to auto reffresh page only once but they both r doin the same work,so can u plz help me in solvin my problem How can I write a JavaScript for the following requirement. I have to go to a link say
Quote: www.google.com and refresh it for every 5 seconds continuously. Thanks Hi Guys, Our company own a lot of domains and want to put a short page of copy on each address along with keywords before redirecting the user to our main site. I have been able to get the page to load the main site after the desired time using this code in the head... Quote: <META HTTP-EQUIV="refresh" CONTENT="40;URL=http://webaddress.com/"> That works perfectly, I am now trying to display a countdown timer from 40 seconds down to 0, and on 0 redirect the user. Saying something like "You will be redirected in XX seconds". Is there anyway of doing this? I've been searching google for the answers with no luck and can only seem to find timers that countdown to a set date. Thanks in advance! Ria Is it possible to change the URL when a page refreshes? E.G Someone clicks a link on index.php to page1.php. When you refresh page1.php it actually loads page2.php The reason i ask my site uses AJAX to change pages (therefore doesnt refresh and stays on the index.php page). So if someone has followed 3-4 links and refreshes the page it will go back to the homepage, i want it so it reloads the currently page (i can use query strings to get the relevant page) Is this possible? I am writing a script that will display an alert box that reads "your play was saved" after a user clicks the submit button on a form. The only problem is that after clicking save, the page refreshes. Here is the code I tried to use Code: function savedMessage(){ document.getElementById("CmdFinish").addEventListener("click",function(e) { GM_setValue("Saved", 1); }, false); if (GM_getValue("saved", 0) == 1) { alert("Your play has been saved"); GM_setValue("saved", 0); // or GM_deleteValue("saved"); } } The button ID is "CmdFinish" and the value is "saved". Is there ANY way i can make the script run only on a page refresh? **Note** The script is for a specific page and not the whole site, so it wont run on every refresh on the site, only when it's needed on 1 page. This may be a stupid question, but is there a way to have a page refreshed at a specific time of day? I have made up a page I set as my browser's home page, an electronic Page-A-Day calendar. If I am working on the computer overnight I would like this page to refresh autotically at midnight. I have seen all sorts of posts that describe how to refresh after a certain amount of time has passed, but nothing for what I would like to do. For those interested the code i have for the webpage in in the attached file. Nite All, I have the following code: Code: $(function() { $("#check_login").click(function() { event.preventDefault(); var $email = $("#login_email").val(); var $password = $("#login_password").val(); $.post("check.php", {email: $email, password: $password}, function(result) { if(result=="Success"){ parent.$.fancybox.close(); window.location.replace("index.php"); }else{ $("#login_check").html(result); $("#login_email").val(''); $("#login_password").val(''); } }); }); }); I'm basically checking a user login. If the login is successful I'd like to close the Fancybox. This part works fine. I'm using an iFrame from Fancybox. If I don't have this part: Code: parent.$.fancybox.close(); It will reload the index page in my iFrame. How can I refresh my other page from the iFrame? Thanks in advance. Hi For our new site we need to regularly update part of page. What solutions are there for this purpose?? Hello. It is Friday. I thought this will be a simple question, but it seen like hard to find a fast and simple solution. I am working on an online sign in tool. Two browser windows are open at the same time. One is for people to sign in with password and submit their information; another one is for Administrator to see who sign in. I am trying to refresh the Administrator page whenever user finished sign in and submitted their information. These two pages cannot be parent and child page. What will be the easiest way to solve this in ColdFusion or JavaScript? Thank you so much for your time. Have a wonderful weekend.
I am running into a problem, that no one else in the world seems to have. When I make a form and submit the page is refreshed, or rather redirected to a state with the values filled after the ? (i.e. http://localhost/comp-267/lab15.html -> http://localhost/comp-267/lab15.html?cardNUm=). I have found solutions that have worked for other people, none of them work for me. I have tested my forms on multiple browsers on multiple systems and the problem persists. Here is one example of my code where this happens. Code: <script type="text/javascript"> function checkCC(myForm) { var ccType; var ccLength; var ccNum = myForm.cardNum.value; if (myForm.cardType.selectedIndex == 0) { ccType = "Visa"; } else if (myForm.cardType.selectedIndex == 1) { ccType = "MasterCard" } else if (myForm.cardType.selectedIndex == 2) { ccType = "AmericanExpress" } switch(ccType) { case "Visa": valid = /^4[0-9]{12}(?:[0-9]{3})?$/; if (valid.test(myForm.cardNum.value)) { alert("This is a Valid Visa Card"); return true; } else { alert("This Card Number is Invalid For Visa"); return false; } break; case "MasterCard": valid = /^5[1-5][0-9]{14}$/; if (valid.test(myForm.cardNum.value)) { alert("This is a Valid MasterCard Card"); } else { alert("This Card Number is Invalid For MasterCard"); } break; case "AmericanExpress": valid = /^3[47][0-9]{13}$/; if (!valid.test(myForm.cardNum.value)) { alert("This is a Valid American Express Card"); return true; } else { alert("This Card Number is Invalid For American Express"); return false; } break; default: valid = /^$/; alert("Card type not found"); return false; } } </script> </head> <body> <h1>Credit Card Validator</h1> <form name="creditCard" onsubmit="return checkCC(this)"> <span class="labels">Card Type:</span> <select name="cardType" size="3"> <option name="visa">Visa</option> <option name="mc">Master Card</option> <option name="amex">American Express</option> </select> <br /> <span class="labels">Card Number:</span> <input name="cardNUm" type="text" size=30 value="" /> <br /> <br /> <input type="submit" value="Death to All" style="background-color:#666666 !important; border:thick groove !important; border-color:#333333 !important" onclick="javascript:return checkCC(this.form)" /> </form> </body> </html> you can find the page he Form Example How do I get this to not happen? I've tried almost every fix I could find that worked for other people none have worked for me. I've a web page when a user logs in, it will have a link that shows the "username" and a link for "logout". After the user logs out, the "username" and the "logout" links will change to "login" and "register" links, respectively. The page uses javascript to check a user cookie, if the user cookie exists, it will show the "username" link and the link for "logout". If no user cookie exists, "login" and "register" links will replace the "username" and "logout" links. Here's the problem: When a user who has log in, clicks the "logout" link, a perl script will delete the user cookie, and redirects back to the same page. The page does not show "login" and "register" links AUTOMATICALLY. Both links will appear ONLY after the user MANUALLY Refreshes the page. It appears that I need a system to refresh the page automacally ONLY one time. How can this be done? Hi, I'm having a problem with my page not resetting to the point where the user clicked on an element. I believe this to be a javascript problem, however, if it is not I would be glad to move it to the proper forum. What I have is a page with a div that contains a large image (a map). the dims are 1237 x 1550. I am using a browser window resized to approx. 800 x 600 so that I can simulate a smaller screen viewport. The page has links that are scattered about the map (positioned with css) and what I want to do is launch a video using the HTML5 video tag when the user clicks on a link. The video is supposed to open in the center of the users viewport and then dim the map div, which it does, however the page resets its position after the js function and aligns the page back to the upper left corner of the browser window. If the user had scrolled (both x and y) to the max of the scroll bar, then this will be fairly frustrating to have to keep moving back, thus my dilemma. I tried using scrollto to reset the scroll back to where the user was, but this is not working. What's funny is if I put an alert at the very end of the function, the page displays properly (video is centered on the screen where the user was in their viewport) but resets as soon as the alert is closed. I then tried using location.reload(false), but this keeps the function from running properly (the page shows properly for a fraction of a second then resets back to a newly launched page). Below is the code. Also, this has only been tested with FF and Chrome on my local drive. It is not anywhere on the web right now. In chrome, the page resets to the top only. I'm really not interested in making this work with IE since this is for personal/family use. Your help is greatly appreciated. Code: CSS body { background: black; text-align: center; vertical-align: middle; } div#bkg { position: absolute; text-align: center; z-index: 1; } p#day1 { position: absolute; top: 800px; left: 1000px; font-weight: bold; width: 50px; background: white; } Javascript function showVid(srcVid) { // set the proper filename of the vid srcVid = srcVid + ".ogv"; // create the video tag var vidWin = document.createElement("video"); vidWin.id = "movie"; vidWin.setAttribute("width", "320"); vidWin.setAttribute("height", "240"); vidWin.setAttribute("controls", "controls"); // pic size is 1237 x 1550 var vpw = window.innerWidth; var vph = window.innerHeight; var xPosOff = window.pageXOffset; var yPosOff = window.pageYOffset; var leftNum = ((vpw/2) + xPosOff) - 160; var topNum = ((vph/2) + yPosOff) - 120; vidWin.setAttribute("style", "position: absolute; left: " + leftNum + "px; top: " + topNum + "px; z-index: 255;"); // create the source tag var vidSrc = document.createElement("source"); vidSrc.src = "videos/" + srcVid; vidSrc.type = "video/ogg"; vidSrc.codecs = "theora, vorbis"; vidWin.appendChild(vidSrc); document.getElementById('bkg').style.opacity = 0.5; document.body.appendChild(vidWin); window.scrollTo(xPosOff, yPosOff); // tried this, it didn't work // location.reload(false); } HTML <body> <div id='bkg'> <img src="images/pic1.jpg" /> <p id="day1"><a href="#" onclick="showVid('oggtest')">Day 1</a></p> </div> </body> hi there. i have a classic asp page that is using the winhttprequest object to get the contents of website from a different server. Then i modify the html i get to suit my needs.. save it to a file, and then finally, i display this stuff in an IFRAME. (i wrapped a div tag around the iframe so technically, i'm doing something like: "divtabframe.innerHTML = '<IFRAME SRC='myserver/somepage.html'></IFRAME>) My problem is that when i refresh the main page, i want the iframe to also display the latest data. It does get the latest data from the external site and its saved in "somepage.html". But the iframe isn't updated unless i explicitly right-click inside the frame and manually select refresh. I have added a <meta http-equiv="refresh" content="30"> line to make it auto refresh on it's own. But the users find it annoying that the page refreshes while they're reading it. It would be ideal if when they refresh the main page, the iframe gets updated too. or i could create a new button too... as long as both pages are updated i did find this solution on a different website: document.getElementById(FrameID).contentDocument.location.reload(true); My page inside the iframe is ultimately "local" so it sounds like the above code should work, but i'm not sure what event would be best to trigger this javascript... and i still need a way to refresh the main page too. thanks. Hello! I have been designing a schedule website which will be displayed on several computers throughout the building, I would like to be able to edit the JS during the day but I do not want to be going all through the building refreshing every computer to make sure it has the latest JS version. I also do not want use the meta HTML tag to refresh because that is too noticeable with the images reloading. Basically I would like to only refresh the JS file. I found this link, but it has a button which defeats the purpose. Any way of doing this without the button? FYI, I have the javascript setTimeout("driver()",1000); already so that the clock stays up to date. Not sure if that will make things easier or more complicated... EDIT: not sure why the ICODE tags are not working EDIT 2: Forgot the website! http://www.philnicholas.com/2009/05/...ing-your-page/ |