Javascript question
- Started
- Last post
- 21 Responses
- dbloc0
it's tough with seeing everything...set up a jsfiddle with html css and JS
http://jsfiddle.net/- <-- this will get you answers far quicker than posting code in a forumhereswhatidid
- CygnusZero40
Oh man, nevermind, have you tested these 2 options? Both are really funky and buggy. I thought at first it was working right but its not at all.
- dbloc0
ok man...try this.
http://pastebin.com/zsVdUDDQ- < use this one...so clicking it when open it will closedbloc
- Its extremely buggy. Did you test it?CygnusZero4
- CygnusZero40
Ok that fixed it dbloc. That none should have been block so I thought I was doing something wrong. Works fine now, whew. Thanks.
- CygnusZero40
Ok, guys I dont know javascript. Pretend this is my very first day doing this. How do I take this code and make it so that when the buttons are clicked, all are collapsed. PLEASE edit this code. Dont send snippets of code. I do not know how to implement what youre sending.
<script type="text/javascript">
function hideshow(which){
if (!document.getElementById)
return
if (which.style.display=="block")
which.style.display="none"
else
which.style.display="block"
}
</script>
<a href="javascript:hideshow(document.getElementById('adiv1'))">Option 1</a>
<div id="adiv1" style="font:24px bold; display: block">Option 1 description</div>
<a href="javascript:hideshow(document.getElementById('adiv2'))">Option 2</a>
<div id="adiv2" style="font:24px bold; display: block">Option 2 description</div>
<a href="javascript:hideshow(document.getElementById('adiv3'))">Option 3</a>
<div id="adiv3" style="font:24px bold; display: block">Option 3 description</div>
- dbloc0
- Doesnt work. All this does is break the expanding which I already had working.CygnusZero4
- last one should say 'block' not nonedbloc
- dbloc0
add the display none within the function that you are calling, just make sure it's before you
function hideshow(which){
document.getElementById('adiv1... = "none";
document.getElementById('adiv2... = "none";
document.getElementById('adiv3... = "none";
which.style.display="none"
}
- dbloc0
add the display none within the function that you are calling, just make sure it's before you
<script type="text/javascript">
function hideshow(which){
document.getElementById('adiv1... = "none";
document.getElementById('adiv2... = "none";
document.getElementById('adiv3... = "none";
which.style.display="none"
}
</script>- lolCygnusZero4
- see previous postCygnusZero4
- where you are calling it is fine...see pastebin link belowdbloc
- CygnusZero40
This is what im not understanding. I already have a function on the buttons, that I cant remove! Its needed to expand them. Youre removing it in the code youre sending so I dont know what to do. I am not a programmer. HALP!!!
a href="javascript:hideshow(docume...
- uan0
but depending on how much you need any more js on the page, it's worth using jquery and access the classes like dbloc suggested
- uan0
<a href="javascript: hideallothers(document.getElementById('adiv1'))">Option 1</a>
- monospaced0
Yikes. So glad I got into graphic design and not web stuff.
- Lol you say that in every thread I have a tech question in.CygnusZero4
- I say that whenever I see a page of code. It's just so far from what I do as a designer, that's all. LOL.monospaced
- Lmao its not that hard. I just struggle with stupid javascript shit here and there. Sometimes flash issues.CygnusZero4
- wordmonospaced
- CygnusZero40
How do I take the below and when you expand one, turn all others off? I know nothing about this stuff so I kind of need this code modified. I dont know how to execute multiple functions and all that and cant seem to get either option above to work.
<script type="text/javascript">
function hideshow(which){
if (!document.getElementById)
return
if (which.style.display=="block")
which.style.display="none"
else
which.style.display="block"
}
</script>
<a href="javascript:hideshow(document.getElementById('adiv1'))">Option 1</a>
<div id="adiv1" style="font:24px bold; display: block">Option 1 description</div>
<a href="javascript:hideshow(document.getElementById('adiv2'))">Option 2</a>
<div id="adiv2" style="font:24px bold; display: block">Option 2 description</div>
<a href="javascript:hideshow(document.getElementById('adiv3'))">Option 3</a>
<div id="adiv3" style="font:24px bold; display: block">Option 3 description</div>- Well I shouldnt say I know nothing, just not much of a javascript guy.CygnusZero4
- CygnusZero40
^ How do you execute the hideallothers function? Sorry not really an expert developer.
- dbloc0
<a href="javascript:hideallothers('adiv3')">Option 3</a>
<div id="adiv3" class="adiv">Option 3 description</div>
- dbloc0
function hideallothers(which){
$(".adiv").css("display","none...
$(which).css("display","block");
}- with a class of adivdbloc
- Something is wrong with this script. Doesnt paste right into dreamweaver. Im not a programmer guys. Keep it simple please.CygnusZero4
- please.CygnusZero4
- yeah it's truncating the code.dbloc
- uan0
function hideallothers(which){
document.getElementById('adiv1...
document.getElementById('adiv2...
document.getElementById('adiv3...
which.style.display="block";
}
- CygnusZero40
One last question. How do you take this script and make it so each item clicked closes all of the other open items. Right now you can expand all which I dont want. In the end it will look like this:
<script type="text/javascript">
function hideshow(which){
if (!document.getElementById)
return
if (which.style.display=="block")
which.style.display="none"
else
which.style.display="block"
}
</script><a href="javascript:hideshow(document.getElementById('adiv1'))">Option 1</a>
<div id="adiv1" style="font:24px bold; display: block">Option 1 description</div><a href="javascript:hideshow(document.getElementById('adiv2'))">Option 2</a>
<div id="adiv2" style="font:24px bold; display: block">Option 2 description</div><a href="javascript:hideshow(document.getElementById('adiv3'))">Option 3</a>
<div id="adiv3" style="font:24px bold; display: block">Option 3 description</div>
- CygnusZero40
Lolz, I was trying display hidden. No clue why. Barely know anything about this shit. Thanks.
- I make that mistake all the time.jtb26
- Lolz is RIGHT, right?monospaced