JavaScript - Script To Show Div Based On Referrer Within The Same Site
Hello,
I have very little knowledge of javascript, other than modifying existing scripts, and I can't find anything about this particular problem. I need some help on creating a simple script that will display a div ONLY if the user comes from a certain page within the same site. Not sure if that was clear, but let me try with specifics. There is a link to a page called 'Clients' on the 'About Us' page. If a user goes directly to 'Clients', they should have a normal experience. If, however, they come via the 'About Us' page, I want to display a div at the bottom of the page that will take them back to the 'About Us' page. I know how to get a referrer, and I know how to show/hide divs. I just don't know how to combine the two. Can anyone help? Similar TutorialsI'l not good in Javascript and I can't find anything about what I want.. . On a sports website there is a table with our ranking and results. On this site the content is changed weekly, but it stays in the same tables.. . Is it possible to make a javascript to get those tables and put them on my own website so the content will change on my site when the content is changed on the sports site? Please help me, it would save me lot of time.. . THx Probably a simple question but it's got me stumped, this post on codingforums didn't really help me either. I have 5 divs, and I want to have each of them visible seperately on a certain weekday. In pseudo-code: Code: if today=monday, show div "bla1" if today=tuesday, show div "bla2" etc. "bla2" should not be visible if it's monday, etc. I've struggled with trying to bend existing scripts to this purpose but I can't get it working. Please help! can any guys help me to fine the jquery based slide show right to left with next previous and auto facilities on div not on ul li based?
hi, the following function shows a list of Counties populates by a PHP page: Code: $.getJSON('http://www.mypubspace.com/dashtest/countyjson.php', function(data){ var myhtml = '<ul>'; for(i=0; i<data.length; i++) { myhtml += '<li>' + data[i].County + '</li>'; } myhtml += '</ul>'; $("#countyshow").html(myhtml); }); I would like to now, when a user clicks on a County, they are shown a list of pubs based on that County (so, I'll create a new PHP page WHERE County = 'County' or something?!) at the moment, when a user clicks on a County this function is passed: Code: function gopublist(event) { var stackLayout = document.getElementById('stackLayout').object; // Replace with id of StackLayout stackLayout.setCurrentView('view4'); } So, passing a value through so I can modify the SQL in the PHP page to filter the counties?! Please help? I have this script that I got from some site. When you click on a link tied to a div it hides all other divs and displays just that one. Well, that works, but I want it to display one of the divs on page load based on today's date. For example, it will display the "summer" div if today's date is anywhere between June 1 and August 31. When links to other divs are clicked that div will disappear and other ones will appear in its place. Anyway, here's the code, and I don't know anything about javascript so I have no idea where to even start editing it. Please help Code: <script type="text/javascript"> <!-- Layer Show/Hide Script last="" function changeDiv(the_div,the_change) { var the_style = getStyleObject(the_div); if (the_style != false) { the_style.display = "block" if(last!="") { last.display = "none" } } last=the_style } function getStyleObject(objectId) { if (document.getElementById && document.getElementById(objectId)) { return document.getElementById(objectId).style; } else if (document.all && document.all(objectId)) { return document.all(objectId).style; } else { return false; } } //--> </script> Hello all, I need some help! I am trying to finish a script that shows a particular div based on the last 2 chars in the cookie value. I have the cookie part done. I just need a little help with the show hide part. Can anyone help! Thanks in advance! Code: <HTML> <HEAD> <TITLE>cookie set, delete, get value and create</TITLE> <SCRIPT LANUAGE="JavaScript"> /** * Sets a Cookie with the given name and value. * * name Name of the cookie * value Value of the cookie * [expires] Expiration date of the cookie (default: end of current session) * [path] Path where the cookie is valid (default: path of calling document) * [domain] Domain where the cookie is valid * (default: domain of calling document) * [secure] Boolean value indicating if the cookie transmission requires a * secure transmission */ function setCookie(name, value, expires, path, domain, secure) { document.cookie= name + "=" + escape(value) + ((expires) ? "; expires=" + expires.toGMTString() : "") + ((path) ? "; path=" + path : "") + ((domain) ? "; domain=" + domain : "") + ((secure) ? "; secure" : ""); } /** * Gets the value of the specified cookie. * * name Name of the desired cookie. * * Returns a string containing value of specified cookie, * or null if cookie does not exist. */ function getCookie(name) { var dc = document.cookie; var prefix = name + "="; var begin = dc.indexOf("; " + prefix); if (begin == -1) { begin = dc.indexOf(prefix); if (begin != 0) return null; } else { begin += 2; } var end = document.cookie.indexOf(";", begin); if (end == -1) { end = dc.length; } return unescape(dc.substring(begin + prefix.length, end)); } </SCRIPT> </HEAD> <BODY> <input type="button" value="Set Cookie" onclick='setCookie("location", prompt("Enter your location:\n Enter \"Baltimore, MD\" in the text box below."))' /> <br> <br> <script> var state = getCookie("location").slice(-2); if (state=='MD' || state=='NC'){ alert("location stripped to" + " - " + state); //Show hide code here... } </script> Refresh page after setting the cookie to "Baltimore, MD"<br> <br> <div id="image1">Image1</div> <div id="image2">Image2</div> <div id="image3">Image3</div> </BODY> </HTML> Ok so I have a select box where the value must be passed via the form. If the users selects choice B or Choice C then I want a specific div to show. If they choose choice A then I want the div to hide or remain hidden. It should be hidden on page load. Code: <select name="Event_Type_ID"> <option value="1">Choice A</option> <option value="2">Choice B</option> <option value="3">Choice C</option> </select> <div id="showme"> Content to show if EITHER Choice B or C is chosen. Otherwise this div should be hidden. </div> Can anyone lead me in the right direction? Thanks! So I am trying to make a form that will eventually take the user to a specified link. It is a form that uses drop down menus. I based this off of someone elses code (with permission ), but it shows everything <= user input. I cannot for the life of me figure out how to make it only show only one of the next options. here is the JS code: Code: <script language="JavaScript"> function ShowMenu(num, menu, max) { for(i = 1999; i <= num; i++){ var menu2 = menu + i; document.getElementById(menu2).style.display = 'block'; } var num2 = num; num2++; while(num2 = max){ var menu3 = menu + num2; document.getElementById(menu3).style.display = 'none'; num2=num2+1; } } </script> This is only the JS code. I didn't want to waste space with the rest of the code. If you want to see it let me know and I can include that. I am sure this is rather basic, but my JS knowledge is less than that...It has been some time since undergrad computer science class. Thanks in advance for any help! Hi ya all, how can I show / hide the content of sub divs based on whether the input is != or = and be able to repeat this. I tried to hide the sub divs using , onclick if bla bla = '' ; Code: document.getElementById('hideme').innerHTML = ''; which works, but once I try to enter a new input, then nothing happens, even if the content of the sub divs is = input thx Hey all, I'm trying to get the two followup questions underneath the checkbox to show up only if someone places a check there, but for some reason the way I've got it set up now it's simply hiding the area I want to show up altogether, and the checkbox has no effect on it. Rather than waste tons of space pasting it here, here's the pastebin: http://pastebin.ca/1822165 alternatively here is the live version: http://soniajacobwedding.com/site/rsvptest.html I'd prefer to have the form collapse when the additional questions are hidden, though if i can get this working at all I'd be pretty happy. i hope this is the right section to post this in. wasnt sure if this question was client side or server side i have a javascript slideshow that i would like to add to my website. its free to use and it came with some coding when downloaded. my problem is that this is my first time EVER using java (ive fiddled with php tho ) and i cant get the slide show to work on my site. the coding it came with gives you an entire webpage ... i just need the slideshow to go inside a div container instead of being a whole page the following is an embedded style that you can simply copy and paste to notepad, save as an html file, and open in your browser. (im using firefox) all the images etc are already being hosted. so you have to do nothing but open it in your browser to see the script working. like i said, this is the code for an entire webpage ... i just need the slide show by it self in a div container 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>TinySlider - JavaScript Slideshow</title> <style all="media" title="YourConnexx Media" type="text/css"> * {margin:0; padding:0} body {font:12px Verdana,Arial; color:#555; background:#222 url(images/bg.jpg) 50% 0 no-repeat} p {line-height:1.4; margin-bottom:12px} #wrapper {width:578px; margin:75px auto} .sliderbutton {float:left; width:32px; padding-top:134px} .sliderbutton img {cursor:pointer} .sliderbutton img:hover {background:#666} #slider {float:left; position:relative; overflow:auto; width:500px; height:300px; border:2px solid #fff; background:#fff} #slider ul {position:absolute; list-style:none; top:0; left:0} #slider li {float:left; width:500px; height:300px; padding-right:10px} .pagination {float:left; list-style:none; height:25px; margin:15px 0 0 32px} .pagination li {float:left; cursor:pointer; padding:5px 8px; background:#666; border:1px solid #999; margin:0 4px 0 0; text-align:center; color:#222} .pagination li:hover {background:#777; border:1px solid #bbb; color:#000} li.current {border:1px solid #ccc; background:#888} li#content {width:464px; height:270px; padding:15px 28px 15px 18px} #content h1 {font:22px Georgia,Verdana; margin-bottom:15px; color:#036} </style> <script type="text/javascript" src="script.js"></script> </head> <body> <div id="wrapper"> <div> <div class="sliderbutton"><img src="images/left.gif" width="32" height="38" alt="Previous" onclick="slideshow.move(-1)" /></div> <div id="slider"> <ul> <li id="content"> <h1>TinySlider - Simple JavaScript Slideshow</h1> <p>This super lightweight (1.5 KB) sliding JavaScript slideshow script can easily be customized to integrate with any website through CSS. You can add any content to it, not just images, and it gracefully degrades without JavaScript support. The script supports automatic rotation with the option to auto-resume, an active class on a navigation list if applicable, and a direction toggle (vertical or horizontal).</p> <p><em>For complete details visit <a href="http://www.leigeber.com/">leigeber.com</a>.</em></p> </li> <li><img src="photos/sea-turtle.jpg" width="500" height="300" alt="Sea turtle" /></li> <li><img src="photos/coral-reef.jpg" width="500" height="300" alt="Coral Reef" /></li> <li><img src="photos/blue-fish.jpg" width="500" height="300" alt="Blue Fish" /></li> </ul> </div> <div class="sliderbutton"><img src="images/right.gif" width="32" height="38" alt="Next" onclick="slideshow.move(1)" /></div> </div> <ul id="pagination" class="pagination"> <li onclick="slideshow.pos(0)">1</li> <li onclick="slideshow.pos(1)">2</li> <li onclick="slideshow.pos(2)">3</li> <li onclick="slideshow.pos(3)">4</li> </ul> </div> <script type="text/javascript"> var slideshow=new TINY.slider.slide('slideshow',{ id:'slider', auto:3, resume:true, vertical:false, navid:'pagination', activeclass:'current', position:0 }); </script> </body> </html> please show me what i need to get this slide show into a div container by it self. when i do it it doesnt work at all. it appears in the div container as a text area or something but it doesnt work at all. just shows the first slide and nothing else How can i make counter for my site that will alert how many visitors had been before every new Visiting? <script type="text/javascript" > function counter(incrimentbyone){ // IF i make var i=0 everytime alert will be 1 and like this alert is "NaN" var i=i+incrimentbyone; alert(i); } </script> <body onLoad="counter(1)"> Can anyone help me out with a script that can redirect based on IP address? I want all of my computers on my LAN, 192.168.1.1-255 to be redirected to a specific page. IE When I type in test.homeip.com it goes to my web server and reads the index.html file. If the IP is in the 192.168.1.0 range it will redirect to 192.168.1.10:80 and if its any other IP it will send it to 192.168.1.11:80 Thanks! I would like to put a script on our website that users could interact with and that would ask a series of questions and based on those questions propose answers. Im surprised I cant find much on the web to help me do this. Does anyone know a PHP script, widget, or template that could provide me this functionality? I just want to be able to input a series of questions and answers and the logical flow and be able to host it on our web server. Anyone know of a script that shows a different page based upon a users IP address? Thanks I've been running into some trouble with a script that just isn't working, and since I'm not encountering any error messages and a similar script on the same page is working just fine, I'm really puzzled. Anyways, here's the code I'm having trouble with: Code: function ShowHide(Numb){ Ident1 = AdIDList[Numb]+"Tx"; Ident2 = AdIDList[Numb]+"Lnk"; if (AdLink[Numb] == "hidden"){ document.getElementById(Ident1).style.height = "355px"; AdLink[Numb] = "visible"; } if (AdLink[Numb] =="visible"){ document.getElementById(Ident1).style.height = "55px"; AdLink[Numb] = "hidden"; } } And here's the page code calling it (The page is assembled via PHP from a database, but I'm grabbing the code from my browser) Code: <a href="#Good ShepherdLnk" id="Good ShepherdLnk" onclick="ShowHide(2);return false;" class="AdLink">Stories</a><br> And, here's a similar bit of code on the same page that is working just as it's supposed to. Code: function hideimage(){ for (Count=0; Count<AdTotal; Count ++){ if (VisPic[Count]=="visible"){ Ident = AdIDList[Count]+"AdB"; document.getElementById(Ident).style.visibility = "hidden"; VisPic[Count]="hidden"; } } } function bigimage(Item){ hideimage(); Ident1 = AdIDList[Item]+"AdB"; document.getElementById(Ident1).style.left="35%"; document.getElementById(Ident1).style.visibility = "visible"; VisPic[Item] = "visible"; } Any help would be awesome and much appreciated! I'm trying to change an id by referencing the previous site the user was on. In this case the user will be coming from either facebook or linkedin. I'm not sure if i'm calling the referrer property correctly. Again, any help is greatly appreciated! <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <script language="JavaScript"> if(document.referrer.toLowerCase().indexOf("facebook") != -1) { document.getElementById("phone").innerHTML = "555.555.5555"; } else if (document.referrer.toLowerCase().indexOf("linkedin") != -1) { document.getElementById("phone").innerHTML = "222.222.2222"; } else { //Default code } </script> </head> <body> <p id="phone">123.456.7890</p> </body> I have used this script successfully: http://www.javascriptkit.com/script/...2/refer2.shtml However, is there a way to block the following work-around (example only): http://www.their-url.com/redir.php?u...ww.my-url.com/ The redir.php makes it possible to get past the script. A little question: Which referrer gets facebook if I make a getjson to https://graph.facebook.com/someid?callback=? Does facebook get as http referrer the client or my server? Hi all, I have a frame structure (three frames) where the top one is my flash navigation. The navigation itself is quite complex so I have given up on the idea of creating a back button code to control the flash. All I want to do now is to refresh the flash page when browser's back button is pressed. What I would like to do is to set a variable of the previous page I just have been so when I hit browser's back button I know if this page is the same as the variable. In each individual page i would set the varaible to be the previous page. Here are few things I have tried so far and none of them seems to work (even online!) (sections is the name of the main frame) old_page = parent.sections.history.previous; old_page =document.referrer; I tried both of them at the beginning of each page. then used onUnload command in the body tag to call a function on another frame where I have the comparison: function check_history(old_page){ if (old_page == parent.sections.location){ alert(" refresh flash"); } If I use referrer, the value is null (empty) or if I use history the variable is undefined. Has anyone come accross with anything similar? Thank you very much for your help. |