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

    Jquery Hide Method Help

    My HTML is

    <div id="entry" class="entry">
    <p>First Para. Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!First Para. Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!First Para. Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!Welcome to WordPress. This is your first post. Edit or delete it, then start blogging! </p>
    </div>



    If I use this code

    $(document).ready(function(){
    $('#entry p').hide();
    });



    It will hide the whole paragraph. But I want to hide 30% or 100 Pixel . Is it possible?

  • #2
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,885
    Thanks
    56
    Thanked 539 Times in 536 Posts
    you can use overflow:hidden CSS, but that may cut lines off midway through, you may want to look at calculating line height, etc...

    Code:
    <style>  
    #entry{overflow:hidden}
    </style>  
      </head>
    <body>
    <div id="entry" class="entry">
    <p>First Para. Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!First Para. Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!First Para. Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!Welcome to WordPress. This is your first post. Edit or delete it, then start blogging! </p>
    </div>
    <script>
    
    $(document).ready(function(){
    var el=$('#entry p');
    var ht=el.height();
    el.height(ht*.7);
    });
    </script>
    
    </body>


  •  

    Posting Permissions

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