FAQ Code]Code Created by Dan T
Preview :
HEREPlease only change the stuff in color otherwise it might not work.Instructions:
- Make a Forum ( or have a forum you want to put it in)
- Copy and Paste the code in the forum rules ( make it a link and link to it or show the full text)
- Change the Variables and the text in color to whatever you want.
- Change the Question to what you want
- Click Submit and you are all set
Feel Free to change the CSS colors to what fits your board :P
green = The Variable in the Javascript and the text that corresponds to it ( make sure the variables made in the Javascript to the onclick function)
red = Picture that will show you to help people know what they clicked on
blue = Question # or what you want to call it ( the think they click on)
purple = the Question
- Quote:
-
<style>
#bord {
border: 1px solid #545454;
}
#code {
float:left;
margin-right: 15px;
color: #7093DB;
}
#right {
margin-left:200px;
margin-right 15px;
}
#block {
clear: both;
}
</style>
<script language='JavaScript' type="text/javascript">
/* Created by Dan T on iFusion */
var a ="Click the question to get an answer"
function showmore(txt){
var idiv = document.getElementsByTagName("DIV")
for(i=0;i<idiv.length;i++){
if(idiv.innerHTML.match(/FAQ/i) && idiv.className == "thehover")
{
idiv.innerHTML = "<b>FAQ Answers:</b><br/><br/>"+txt+"<br/><br/>"
}}}
function colorbold(obj,par,curid){
// Remove old colors and images first
var iLst = document.getElementById( curid ).getElementsByTagName('LI');
for(i=0;i<iLst.length;i++){
iLst.getElementsByTagName('IMG')[0].style.display="none";
iLst.getElementsByTagName('A')[0].style.color="#545454";
}
obj.style.color="#2344B1";
par.getElementsByTagName('IMG')[0].style.display="";
}</script>
<div id="bord"><div id="code"><div id="color">Click on Question to get Answers to the FAQs: <ul id="lstLinks1">
<li><a href='javascript:void(0)' style='text-decoration:none' onclick="showmore(a);colorbold(this,this.parentNode,'lstLinks1');">
<img src='URL HERE' style='display: none;' border='0'>
Question 1</a> : How does this work? </li>
</ul> </div></div><br/><div id="right">
<div class="thehover"><b>FAQ Answers:</b><p>
Click above to get answers
</p></div></div><div id="block"></div></div>
add more
- Quote:
-
<li><a href='javascript:void(0)' style='text-decoration:none' onclick="showmore(a);colorbold(this,this.parentNode,'lstLinks1');">
<img src='URL HERE' style='display: none;' border='0'>
Question 1</a> : How does this work? </li>
inside the <ul> tags