bernie.nmsu Posted March 11, 2005 Share Posted March 11, 2005 I'm creating a FAQ's page. The layout that I want to use is to list the questions and allow the user to select the question and display the FAQ right under the question. If the user selects the question again, the answer gets hidden. Does someone know how to code this functionality. I'm still learning. Thanks. Link to comment https://forums.phpfreaks.com/topic/2204-creating-a-faqs-page/ Share on other sites More sharing options...
Shaun Posted March 11, 2005 Share Posted March 11, 2005 I'm creating a FAQ's page. The layout that I want to use is to list the questions and allow the user to select the question and display the FAQ right under the question. If the user selects the question again, the answer gets hidden. Does someone know how to code this functionality. I'm still learning. Thanks. 213033[/snapback] this would be javascript.. look it up on google. Link to comment https://forums.phpfreaks.com/topic/2204-creating-a-faqs-page/#findComment-7233 Share on other sites More sharing options...
bernie.nmsu Posted March 11, 2005 Author Share Posted March 11, 2005 I haven't found anything. I've never used Javascript. Is there a specific function that I need to use? Link to comment https://forums.phpfreaks.com/topic/2204-creating-a-faqs-page/#findComment-7235 Share on other sites More sharing options...
Shaun Posted March 11, 2005 Share Posted March 11, 2005 I haven't found anything. I've never used Javascript. Is there a specific function that I need to use? 213074[/snapback] yes there would be... maybe post something in the javascript forum. Link to comment https://forums.phpfreaks.com/topic/2204-creating-a-faqs-page/#findComment-7236 Share on other sites More sharing options...
bernie.nmsu Posted March 11, 2005 Author Share Posted March 11, 2005 Looks like I found something. This seems to work for me. <html> <head> <title>Untitled</title> <script language="JavaScript"> function showAndHide(theId) { var el = document.getElementById(theId); var link = document.getElementById("moreLink"); if (el.style.display=="none") { el.style.display="block"; //show element link.innerHTML = "Hide Links..."; } else { el.style.display="none"; //hide element link.innerHTML = "More..."; } return false; } </script> </head> <body> <p><a id="moreLink1" href="#" onClick="return showAndHide('QUESTION1')">FAQ #1</a></p> <div id='QUESTION1' style="display:none"> ANSWER 1<br> ANSWER 1A</a><br> ANSWER 1B</a><br> </div> </body> </html> Thanks for the help. Link to comment https://forums.phpfreaks.com/topic/2204-creating-a-faqs-page/#findComment-7237 Share on other sites More sharing options...
Shaun Posted March 11, 2005 Share Posted March 11, 2005 Looks like I found something. This seems to work for me.<html> <head> <title>Untitled</title> <script language="JavaScript"> function showAndHide(theId) { var el = document.getElementById(theId); var link = document.getElementById("moreLink"); if (el.style.display=="none") { el.style.display="block"; //show element link.innerHTML = "Hide Links..."; } else { el.style.display="none"; //hide element link.innerHTML = "More..."; } return false; } </script> </head> <body> <p><a id="moreLink1" href="#" onClick="return showAndHide('QUESTION1')">FAQ #1</a></p> <div id='QUESTION1' style="display:none"> ANSWER 1<br> ANSWER 1A</a><br> ANSWER 1B</a><br> </div> </body> </html> Thanks for the help. 213087[/snapback] *SOLVED* Sweet, ill be using that too Link to comment https://forums.phpfreaks.com/topic/2204-creating-a-faqs-page/#findComment-7238 Share on other sites More sharing options...
phpfreakjav Posted December 18, 2008 Share Posted December 18, 2008 It can be done with php <?php function start_section( $id, $title ) { ?> <div> <a href="javascript: void twist('<?php echo($id); ?>');"><img style="border:none;" alt="click here to open menu" "src="images/up.jpg" id="img_<?php echo($id); ?>"/></a> <h3><?php echo( $title ); ?></h3> <div style="visibility:hidden;position:absolute;" id="<?php echo($id); ?>" class="spin-content"> <?php } function end_section( ) { ?> </div></div> <?php } function spinner_header( ) { ?> <style type="text/css"> h3 {border-bottom: 1px solid black;display:inline; } .spin-content{font-size:small;padding:10px 0 10px 30px;} </style> <script language="Javascript"> function twist( sid ) { imgobj = document.getElementById( "img_"+sid ); divobj = document.getElementById( sid ); if ( imgobj.src.match( "images/up.jpg" ) ) { imgobj.src = "images/down.jpg"; divobj.style.position = "relative"; divobj.style.visibility = "visible"; } else { imgobj.src = "images/up.jpg"; divobj.style.visibility = "hidden"; divobj.style.position = "absolute"; } } </script> <?php } ?> in the page that u want to use the function. <?php start_section( "one", "Equipment Checkout" ) ?> <ul> <li><a target="_blank" href="http://www.cslaee.com/pdf/forms/210_locker_checkout.pdf">EE-210</a></li> <li><a target="_blank" href="http://www.cslaee.com/pdf/forms/211_%20locker_checkout.pdf">EE-211</a></li> <li><a target="_blank" href="http://www.cslaee.com/pdf/forms/317_locker_%20checkout.pdf">EE-317</a></li> <li><a target="_blank" href="http://www.cslaee.com/pdf/forms/340_%20locker_checkout.pdf">EE-340</a></li> <li><a target="_blank" href="http://www.cslaee.com/pdf/forms/346_locker_checkout.pdf">EE-346</a></li> <li><a target="_blank" href="http://www.cslaee.com/srd.html">EE-496</a></li> <li><a target="_blank" href="http://www.cslaee.com/pdf/forms/fpga.pdf">FPGA Board</a></li> <li><a target="_blank" href="http://www.cslaee.com/cardkey.html">Card Key Access</a></li> </ul> <?php end_section( ) ?> Link to comment https://forums.phpfreaks.com/topic/2204-creating-a-faqs-page/#findComment-718743 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.