Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 1 of 1
  1. #1
    New to the CF scene
    Join Date
    Jun 2012
    Location
    Kincardine
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    TUT: Spoilers for HTML

    After searching the web for hours with little to no results, I finally found a nice peice of code that done the trick with a bit of twaeking.

    Here is the result we will be looking for:

    http://www.codingforums.com/attachme...1&d=1338804153

    the code behind it is pretty simple, but contains a little bit of javascript:

    Code:
    <div class="pre-spoiler">
    <input onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';this.innerText = ''; this.value = 'Hide Update'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.value = 'Show Update';}" style="font-size: 10px; margin: 0px; padding: 0px; width: 140px;" type="button" value="Show Update" />
    </div>
    <div>
    <div class="spoiler" style="display: none;">
    PLACE YOUR CONTENT HERE
    </div></div>
    The code does need cleaning up, and I will revisit it later but it gets the job done.

    Hope you find it useful.

    EDIT: Just noticed this was moved, thanks to whoever moved it.
    Attached Thumbnails Attached Thumbnails TUT: Spoilers for HTML-spoiler1.jpg  
    Last edited by williamsoft1; 06-04-2012 at 01:37 PM.


 

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •