Log in

View Full Version : Create link to content hidden by show/hide javascript



raul
12-26-2014, 03:43 AM
Hello, all.

First time poster here. I may not ask my question in the most accurate way. I'm not even sure this is the appropriate forum for this question, so please be patient with this newbie.

I would like to create a link to content that is hidden by a show/hide java script. Below is a generic version of that code, which is working perfectly. Within each one of the hidden contents I have threes divs with videos and text in them. I would like to create links to each one of them.

XHTML

<p>***Visible content***
<a href="#" id="example-show" class="showLink"
onclick="showHide('example');return false;">See more.</a>
</p>
<div id="example" class="more">
<p>***Hidden content***</p>
<p><a href="#" id="example-hide" class="hideLink"
onclick="showHide('example');return false;">Hide this content.</a></p>

EXTERNAL CSS

.more {
display: none;
}

a.showLink, a.hideLink {
color: #000000;
a.hideLink {
background: transparent url('up.gif') no-repeat left;
}
a.showLink:hover, a.hideLink:hover {
border-bottom: 1px dotted #36f;
}

JAVASCRIPT

function showHide(shID) {
if (document.getElementById(shID)) {
if (document.getElementById(shID+'-show').style.display != 'none') {
document.getElementById(shID+'-show').style.display = 'none';
document.getElementById(shID).style.display = 'block';
}
else {
document.getElementById(shID+'-show').style.display = 'inline';
document.getElementById(shID).style.display = 'none';
}
}
}

I hope my questions makes sense. Thanks in advance!

Beverleyh
12-28-2014, 12:24 AM
Within each one of the hidden contents I have threes divs with videos and text in them. I would like to create links to each one of them. Your first block of code is doing that already (or maybe you mean to combine it with a named anchor/jump links?) but if this isn't what you want, please post a link to your page (the one you describe), not the generic code that is already working perfectly.

I hope my questions makes sense. Thanks in advance!i couldn't see a question in your post. Can you please clarify what you would like help with? Maybe it will make more sense when you post a link to your actual page and show what you have already tried.