The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

FAQ coding help

2 posters

Go down

FAQ coding help Empty FAQ coding help

Post by Sky Pride June 5th 2011, 7:38 pm

Does anyone know the default HTML code for the FAQ effect? Like on all forums, including this one, if you open the FAQ you have the question, then when you click on it you have the answer to it, then when you click on it again it rolls back up. If you have it, could you also post the name of the effect is possible?

Thanks
avatar
Sky Pride
New Member

Posts : 2
Reputation : 0
Language : English

Back to top Go down

FAQ coding help Empty Re: FAQ coding help

Post by Mike June 5th 2011, 7:43 pm

Mike
Mike
Hyperactive

Male Posts : 4255
Reputation : 471
Language : English, HTML, CSS
Location : Loveland, Colorado

Back to top Go down

FAQ coding help Empty Re: FAQ coding help

Post by Sky Pride June 5th 2011, 7:49 pm

Sorry if this causes trouble, but could you explain how it works and how to use it?
avatar
Sky Pride
New Member

Posts : 2
Reputation : 0
Language : English

Back to top Go down

FAQ coding help Empty Re: FAQ coding help

Post by Mike June 5th 2011, 7:52 pm

put this in your templates:

Code:
// Andy Langton's show/hide/mini-accordion - updated 23/11/2009
// Latest version @ http://andylangton.co.uk/jquery-show-hide

// this tells jquery to run the function below once the DOM is ready
$(document).ready(function() {

// choose text for the show/hide link - can contain HTML (e.g. an image)
var showText='Show';
var hideText='Hide';

// initialise the visibility check
var is_visible = false;

// append show/hide links to the element directly preceding the element with a class of "toggle"
$('.toggle').prev().append(' (<a href="#" class="toggleLink">'+showText+'</a>)');

// hide all of the elements with a class of 'toggle'
$('.toggle').hide();

// capture clicks on the toggle links
$('a.toggleLink').click(function() {

// switch visibility
is_visible = !is_visible;

// change the link depending on whether the element is shown or hidden
$(this).html( (!is_visible) ? showText : hideText);

// toggle the display - uncomment the next line for a basic "accordion" style
//$('.toggle').hide();$('a.toggleLink').html(showText);
$(this).parent().next('.toggle').toggle('slow');

// return false so any link destination is not followed
return false;

});
});

then when you do a link put:

Code:
<a href="#" class="toggleLink">trxt</a>
Mike
Mike
Hyperactive

Male Posts : 4255
Reputation : 471
Language : English, HTML, CSS
Location : Loveland, Colorado

Back to top Go down

Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum