SitePoint Sponsor

User Tag List

Results 1 to 11 of 11
  1. #1
    SitePoint Zealot
    Join Date
    May 2012
    Location
    N.Ireland
    Posts
    103
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Multiple 'read more' links on one page...

    I'd like to implement Viral Patel's cool dynamic read more links to a page I'm working on. I'd like to add another level so that I could embed some of these links into another div...See demo here

    Can I add this to the java or would it be better to create another script using a different div id?

  2. #2
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    6,078
    Mentioned
    219 Post(s)
    Tagged
    12 Thread(s)
    Unfortunately the example page is returning a 404

  3. #3
    SitePoint Zealot
    Join Date
    May 2012
    Location
    N.Ireland
    Posts
    103
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Apologies link fixed.....

    Quote Originally Posted by stephen_ View Post
    I'd like to implement Viral Patel's cool dynamic read more links to a page I'm working on. I'd like to add another level so that I could embed some of these links into another div...See demo here

    Can I add this to the java or would it be better to create another script using a different div id?
    I'd also like to allow h and p tags inside the comment div if possible?

  4. #4
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    6,078
    Mentioned
    219 Post(s)
    Tagged
    12 Thread(s)
    The link in your first post points to http://jsfiddle.net/valleysboy/P7Jtz/ and this is still returning a 404

  5. #5
    SitePoint Zealot
    Join Date
    May 2012
    Location
    N.Ireland
    Posts
    103
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sorry Pullo only chaged the quoted link its - http://jsfiddle.net/valleysboy/jvCSe/ (i'll wake up)

  6. #6
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    6,078
    Mentioned
    219 Post(s)
    Tagged
    12 Thread(s)
    Hi there,

    So the demo's working now.
    I can see three divs which display extra content when I click on the more link.

    But what is it exactly that you are trying to do. I didn't quite get it. Could you elaborate a little.

  7. #7
    SitePoint Zealot
    Join Date
    May 2012
    Location
    N.Ireland
    Posts
    103
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Pullo,

    I'd like to have the same <div class="comment more"> that could have the 3 divs inside of it - essentially another level up? (hope this makes sense).

  8. #8
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    6,078
    Mentioned
    219 Post(s)
    Tagged
    12 Thread(s)
    You'd like to have three <div class="comment more"> inside a <div class="comment more">.
    Something like:

    HTML Code:
    <div class="comment more">
      Some random text
      <div class="comment more">Some more random text</div>
      <div class="comment more">Some more random text</div>
      <div class="comment more">Some more random text</div>
    </div>
    Is that what you mean?

  9. #9
    SitePoint Zealot
    Join Date
    May 2012
    Location
    N.Ireland
    Posts
    103
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Apologies I should have added the html - Yes that is exactly what I'd like - also I cant seem to add any html elements inside the div's like <p> <img> tags - it stops the jqery from working, I'd like to fix this also if possible???

  10. #10
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    6,078
    Mentioned
    219 Post(s)
    Tagged
    12 Thread(s)
    Quote Originally Posted by stephen_ View Post
    I cant seem to add any html elements inside the div's like <p> <img> tags - it stops the jqery from working, I'd like to fix this also if possible???
    This works just fine for me. Here's a fiddle to demonstrate: http://jsfiddle.net/openFiddle/9bDJ6/5/

    The other problem is a little trickier.
    You're trying to toggle divs within a div which is toggleable and this cannot work with your current code.

    If I was you, I would use the show-hide plugin instead. Its homepage is here: http://papermashup.com/demos/jquery-show-hide-plugin/
    I've also made you a small demo here demonstrating nested content: http://hibbard.eu/blog/pages/show-hide-plugin-demo.html
    It is entirely configurable. If you don't like the animation effect, you can disable that.

    HTH

  11. #11
    SitePoint Zealot
    Join Date
    May 2012
    Location
    N.Ireland
    Posts
    103
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Pullo View Post
    This works just fine for me. Here's a fiddle to demonstrate: http://jsfiddle.net/openFiddle/9bDJ6/5/

    (think I was hitting a conflict with other js files I had on the page i'll check this)...

    The other problem is a little trickier.
    You're trying to toggle divs within a div which is toggleable and this cannot work with your current code.

    If I was you, I would use the show-hide plugin instead. Its homepage is here: http://papermashup.com/demos/jquery-show-hide-plugin/
    I've also made you a small demo here demonstrating nested content: http://hibbard.eu/blog/pages/show-hide-plugin-demo.html
    It is entirely configurable. If you don't like the animation effect, you can disable that.

    HTH
    GENIUS - code is really well explained - thanks so much Pullo very appriciated!


Bookmarks

Posting Permissions

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