I'm building a website (/) that looks like this.
And I have the following code for detecting a click on the linkedin div, it then redirects.
<script src=".12.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#linkedin").click(function(){
window.location.href = "/";
return false;
});
});
</script>
<body>
<div id="banner">
<div class="menubutton" id="home">Home</div>
<div class="menubutton" id="circuitry">Circuitry</div>
<div class="menubutton" id="programming">Programming</div>
<div class="menubutton" id="stackoverflow">Stackoverflow</div>
<div class="menubutton" id="linkedin">Linkin</div>
</div>
But when I click the div, it redirects to a blank page.
What am I missing?
I'm building a website (http://brandonbarber.co/) that looks like this.
And I have the following code for detecting a click on the linkedin div, it then redirects.
<script src="https://ajax.googleapis./ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#linkedin").click(function(){
window.location.href = "https://www.linkedin./in/brandon-barber-79043593/";
return false;
});
});
</script>
<body>
<div id="banner">
<div class="menubutton" id="home">Home</div>
<div class="menubutton" id="circuitry">Circuitry</div>
<div class="menubutton" id="programming">Programming</div>
<div class="menubutton" id="stackoverflow">Stackoverflow</div>
<div class="menubutton" id="linkedin">Linkin</div>
</div>
But when I click the div, it redirects to a blank page.
What am I missing?
Share Improve this question edited Jun 19, 2016 at 0:38 maelswarm asked Jun 19, 2016 at 0:36 maelswarmmaelswarm 1,0704 gold badges18 silver badges37 bronze badges 10-
Why aren't you saying
location.href = ...
? Using$(location).attr("href",...)
is kind of an odd way to do it. (Also thelocation
object has a propertyhref
, not an attribute.) Also, why aren't you using (styled) anchor elements? Your page won't work for users who can't (or don't) use a mouse or other pointing device. – nnnnnn Commented Jun 19, 2016 at 0:38 - @nnnnnn It doesn't work either. Same thing, a blank page. – maelswarm Commented Jun 19, 2016 at 0:40
- Try location.assign("xx"); or just location = "xx"; either way will work for you – Bryan Euton Commented Jun 19, 2016 at 0:44
-
1
The problem on your site is the frames - check the dev console:
"Refused to display 'https://www.linkedin./in/brandon-barber-79043593/' in a frame because it set 'X-Frame-Options' to 'sameorigin'."
(Always check the dev console for errors if something is behaving unexpectedly.) – nnnnnn Commented Jun 19, 2016 at 0:50 - 1 Frames are deprecated. This is 2016 not 1996. No need to use them in this day and age – charlietfl Commented Jun 19, 2016 at 2:38
2 Answers
Reset to default 7The issue occurs because your entire site is made up of frames/iframes, so when you use window.location.href = "https://www.linkedin./in/brandon-barber-79043593/" you'll prompt the browser to open that page in the iframe which isn't allowed by the source, in this case linkedin.
Refused to display 'https://www.linkedin./in/brandon-barber-79043593/' in a frame because it set 'X-Frame-Options' to 'sameorigin'.
To work around this issue you'll need to use window.open instead of window.location, e.g:
window.open('https://www.linkedin./in/brandon-barber-79043593/', '_blank');
On a side note, I would remend to not iframe the source content of the page and instead setting up a CNAME for your for your domain which points at your IP, because the IP is concurrently exposed in the DOM.
This is actually legit code.
I copied it exactly as is on my server and it works!
http://lespoints./a/misc/demo/2016_06_18/jquery.html
Maybe your internet connections...
nnnnnn is right, it's your frames!
From Mozilla :
Load denied by X-Frame-Options: https://www.linkedin./in/brandon-barber-79043593/ does not permit cross-origin framing.