Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 4 of 4

Thread: more button

  1. #1
    Member
    Join Date
    Oct 2011
    Posts
    61
    Member #
    29656
    I have a page that is all just instructions and information. I have topics and want the customer to be able to click on a word like more to completely open up the description. I am using a accordion spry now and hate it. It looks way to tacky.

    Example of what I am liking for:
    desrciptions.......more>

    Then when some pushes on more the rest of the description shows up and the more word goes away. I have some idea pages I what to use it on. Yahoo does it on page with readers leave feed back to news articles.

    Thanks in advance.

  2.  

  3. #2
    WDF Staff George Dolidze's Avatar
    Join Date
    Apr 2011
    Location
    Irvine, CA
    Posts
    2,487
    Member #
    27540
    Liked
    416 times
    Would you be interested in a jQuery solution?
    My freelancer website: DolidzeDesign



    You only need a parachute if you plan on skydiving twice.

  4. #3
    Senior Member Kayo's Avatar
    Join Date
    Dec 2006
    Location
    Brampton Ontario
    Posts
    416
    Member #
    14523
    Liked
    39 times
    I quickly made this in jQuery
    HTML Code:
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    
    <h1>Title</h1>
    <p>This is the body text. <span class="readmore">This is the information you see when you like read more</span> <a href="#more">More</a></p>
    
    <h1>Title</h1>
    <p>This is the body text. <span class="readmore">This is the information you see when you like read more</span> <a href="#more">More</a></p>
    
    <h1>Title</h1>
    <p>This is the body text. <span class="readmore">This is the information you see when you like read more</span> <a href="#more">More</a></p>
    
    <script>
    $(document).ready( function() {
    $(".readmore").hide();
    $("a[href='#more']").click(function(){
    information = $(this).parent().find(".readmore");
    if (information.is(":hidden")) {
    information.show();
    $(this).text("Hide");
    } else {
    information.hide();
    $(this).text("More");
    }
    });
    });
    </script>

  5. #4
    Member
    Join Date
    Oct 2011
    Posts
    61
    Member #
    29656
    Thank you so much Kayo. This works great. It really saved me a ton of hair pulling.


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 09:48 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com