HTML code for "Learn more..."?

8 replies
  • WEB DESIGN
  • |
How do I enter HTML code to have a link the says "Learn more..." that does not go to another page? I want it to give more info right below it and then the visitor could close it. You see this in FAQ's sometimes.

Example:

Great tip about ABC! Learn more...
Visitor clicks on Learn more... and then it looks like this:

Great tip about ABC! Learn more...
To blah, blah, blah blah, blah, blah, blah blahblah, blah, blah blahblah, blah, blah blahblah, blah, blah blahblah, blah, blah blahblah, blah, blah blahblah, blah, blah blahvblah, blah, blah blahvblah, blah, blah blahvblah, blah, blah blah Close.

Visitor clicks on Close and it goes back to
Great tip about ABC! Learn more...
#code #html #learn more
  • Profile picture of the author lesterdean
    to help you more check w3schools.com and search for html coding. For your more info.

    good luck!
    {{ DiscussionBoard.errors[2918770].message }}
  • Profile picture of the author Janice Sperry
    Thanks - I will check that site out.
    {{ DiscussionBoard.errors[2919541].message }}
  • Profile picture of the author QuinNguyen
    Search for javascript hide script.
    {{ DiscussionBoard.errors[2920284].message }}
  • Profile picture of the author rcaieftin
    Try with javascript !

    <style type="text/css">

    #more_information {

    display:none;

    }

    </style>

    <script type="text/javascript">

    function show() {

    document.getElementById('more_information').style. display = 'block';

    }

    </script>

    <a href="#" onclick="show()">Show more information</a>

    <div id="more_information">
    Here is more information for user
    </div>

    This code should work !
    {{ DiscussionBoard.errors[2920425].message }}
    • Profile picture of the author infoman66
      I agree with you.
      To close an open text - add part of code and one more link.
      Originally Posted by rcaieftin View Post

      <script type="text/javascript">
      function show() {
      document.getElementById('more_information').style. display = 'block';
      }
      function hide() {
      document.getElementById('more_information').style. display = 'none';
      }
      </script>

      <a href="#" onclick="show()">Show more information</a>
      <div id="more_information">
      Here is more information for user and link to close text
      <a href="#" onclick="hide()">Close</a>
      </div>
      {{ DiscussionBoard.errors[3061741].message }}
  • Profile picture of the author johncampbell
    i agree. this should solve your needs.
    {{ DiscussionBoard.errors[2922879].message }}
    • Profile picture of the author shirley_c
      i am copying the code. this is very useful in my future projects..
      {{ DiscussionBoard.errors[3061439].message }}
  • Profile picture of the author bilzz
    You can learn better on HTML tutorial.
    {{ DiscussionBoard.errors[3061761].message }}

Trending Topics