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 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Dec 2006
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Help with showing/hiding text

    I have created a news list using PHP, which displays the title of each news item on a page, but because there are other objects on the page, I would like to make the title clickable so that it will 'open' up and show the rest of the story. I have seen this on some websites before where the rest of the text on the page 'slides' down to make space for the text.

    Thanks in advance,

    Chris.

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,802
    Thanks
    160
    Thanked 2,216 Times in 2,203 Posts
    Blog Entries
    1
    Quote Originally Posted by ferret219 View Post
    I have created a news list using PHP, which displays the title of each news item on a page, but because there are other objects on the page, I would like to make the title clickable so that it will 'open' up and show the rest of the story. I have seen this on some websites before where the rest of the text on the page 'slides' down to make space for the text.

    Thanks in advance,

    Chris.
    You may use seperate hidden <div>s to hold the details of each news (ofcourse you have to keep an id for them and should have some literal relation with its titles)

    then make the title as a link, and on the onclick you can call a function with a dynamically generated value as parameter(use the counter variable of the loop) . In the definition of this function, you can toggle the display property of its underlying div between hidden and block

    Eg: If the value passed on the onclick of first displayed title is say '1', just make

    Code:
    document.getElementById('detail_1').style.display='block';
    if it was hidden else the reverse
    where 'detail_1' is the id of div which is holding its details

    hope this might help

    regards,
    art
    Last edited by abduraooft; 06-14-2007 at 04:09 PM.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    New to the CF scene
    Join Date
    Dec 2006
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks for the quick reply, I'll give the code a try and post back with some feedback.
    Last edited by ferret219; 06-14-2007 at 04:12 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
    •