How can I detect with javascript if an attribute "#" is appended to an url?

Question

How can I detect with javascript if an attribute "#" is appended to an url ?

I need a cross-browser solution. I'm currently using the following code, but it works only in Firefox:

if ((window.location.hash) || (window.location.hash != "#"))
    window.scrollBy(0,-60);

thanks

In which browser does it fail? According to w3schools (w3schools.com/jsref/prop_loc_hash.asp) location.hash should work in all major browsers. — Martin Buberl
– Martin Buberl, Commented Feb 6, 2011 at 16:15
@Martin Buberl So you are saying that theoretically I just need the first part of the if statement ? window.location.hash ? — aneuryzm
– aneuryzm, Commented Feb 6, 2011 at 16:17
I believe he's saying that your code should work in all browsers. — Steven Oxley
– Steven Oxley, Commented Feb 6, 2011 at 16:20
If you jst want to check if there is an appending hash, you could simply write: if(!!window.location.hash) — Martin Buberl
– Martin Buberl, Commented Feb 6, 2011 at 16:21

Frédéric Hamidi · Accepted Answer · 2011-02-06 16:20:32Z

3

First, there seems to be an error in your posted code. If you're going for the common string is neither null nor empty nor '#' pattern, it should be:

if (window.location.hash && window.location.hash != "#")
    window.scrollBy(0,-60);

That said, since Location.hash is well-supported, the code above should work on all modern browsers.

answered Feb 6, 2011 at 16:20

Frédéric Hamidi

264k42 gold badges497 silver badges486 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

aneuryzm Over a year ago

by the way, is window.scrollBy(0,-60); cross-browser ? The hash is no correctly detected in all browsers, but it doesn't scroll in the same way for all of them...

Frédéric Hamidi Over a year ago

scrollBy() is also widely supported. The discrepancies between browsers might be because they render your page in quirks mode. What's your DOCTYPE?

Martin Buberl · Accepted Answer · 2011-02-06 16:26:12Z

1

The following line should do the job for you:

if(!!window.location.hash) // if 'true' you have an appending hash
     window.scrollBy(0,-60);

According to w3schools location.hash should work in all major browsers.

answered Feb 6, 2011 at 16:26

Martin Buberl

47.4k26 gold badges103 silver badges146 bronze badges

1 Comment

Martin Buberl Over a year ago

The first ! checks if the hash is undefined or empty. Which will return a false if there is an hash in the URL. This gets just negated with the second ! to fit the logic. You could also write if(!window.location.hash == false).

Paul · Accepted Answer · 2011-02-06 16:20:07Z

1

If you're finding that the hash property doesn't work in a key browser, you could always just do string parsing, a naive implementation might look like:

var url = window.location.href;
var hashLoc = url.lastIndexOf('#');
if(hashLoc > -1 && hashLoc < url.length )
     window.scrollBy(0,-60);

answered Feb 6, 2011 at 16:20

Paul

36.4k12 gold badges98 silver badges124 bronze badges

Comments

Jouke Waleson · Accepted Answer · 2011-02-06 16:38:05Z

0

For good cross-browser support you can turn to jQuery. It might be overkill for your project, but overall it makes js developing much easier. There is an excellent hashchange plugin which I have used with great success for a couple of months.

answered Feb 6, 2011 at 16:38

Jouke Waleson

5171 gold badge3 silver badges15 bronze badges

Collectives™ on Stack Overflow

How can I detect with javascript if an attribute "#" is appended to an url?

4 Answers 4

2 Comments

1 Comment

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

2 Comments

1 Comment

Comments

Comments

Related