/    Sign up×
Community /Pin to ProfileBookmark

Javascript Collaps/Exapnd Div with Anchor tag

Hi,

I have a question regarding using an anchor tag to redirect the view of the page directly to the hidden div (which is hidden by default) and expand it.

This is difficult since I don’t have the code to provide coz I don’t kno whow to write it. But I’ll try to explain it as simple as possible with this example.

ex: Lets say page1 has a Hot Dog section with a link lets that says <a>Hot Dogs</a> and a anchor tag of <a name=”hotdog”>. When that link is clicked it will expand the hidden div below to say <div>taste good!</div>.

Now lets say Im on page2 and I want to redirect myselft to page 1 to the Hot Dog section. Now on page 2, I’m gonna use <a href=”www.foo.dcom/page1#hotdog”>Hot Dog</a> assuming that page1 has an anchor tag of <a name=”hotdog”></a>.

That’s my question I can’t get it to work. How do I redirect to page 1, and open that div and anchor to that section? Any help is appreciated, thank you, and I apologize if this is not clear.

to post a comment
JavaScript

4 Comments(s)

Copy linkTweet thisAlerts:
@GooberKingJul 19.2008 — Sounds like you need to pass along a variable back to page1 to let it know that you want the hidden div revealed. So, your link on page2 should look something like this:

[code=html]<a href="www.foo.dcom/page1?showDiv=true#hotdog"></a>[/code]

Then, you would have a function in page1 that checks for the presence of showDiv and reveals the hidden DIV if it finds it.
Copy linkTweet thisAlerts:
@vnepoauthorJul 19.2008 — Gooberking, thank you for your reply! I understand what your saying, but I don't know how to write that...I've been searching online looking for a sample so I could learn how its written, but I haven't been lucky. But your response is very helpful though. If you do have a sample for me let me know, thank you sir.
Copy linkTweet thisAlerts:
@Mr_JJul 19.2008 — You could use the query string to pass the anchor name and div id


[CODE]<a href="page1.htm?hotdog&divname">Hotdog</a>[/CODE]

Then in page 1

[CODE]onload=function(){

if (location.search.length > 0){
dataPassed = unescape(location.search.substring(1))

temp=dataPassed.split("&")

location="#"+temp[0] // to anchor

divID=temp[1] // for div
}

}[/CODE]



Depending on how you show and hide the div you can use the variable divID

document.getElementById(divID).style.visibility="visible"

or pass it to your function

showHide(divID)
Copy linkTweet thisAlerts:
@vnepoauthorJul 20.2008 — MrJ, thank you very much!!! I'm gonna try this and get back to you. I really appreciate your help.
×

Success!

Help @vnepo spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 6.16,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...