HTML Help
HTML Help Central . com

» Online Users: 106

0 members and 106 guests
No Members online
Most users ever online was 695, 02-16-2011 at 07:01 AM.

» Site Navigation

 > FAQ

» Domains For Sale

Results 1 to 4 of 4
  1. #1
    Join Date
    Mar 2014
    Posts
    133

    Help: Drop Down Box selects/shows different Boxes of Text

    Is there a way for a drop down box to show different boxes of text (referenced from text files in a folder) within the same page.
    Im not the best at explaining so heres a picture.

    https://i.gyazo.com/012109d73b303744...5c612d0d90.png

    Thanks for any help

  2. #2
    Join Date
    Sep 2007
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    369
    Hi there NZLTruly,

    something simple, like this perhaps...
    Code:
    
    <!DOCTYPE html>
    <html  lang="en">
    <head>
    
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    
    <title>untitled document</title>
    
    <link rel="stylesheet" href="/" media="screen">
    
    <style media="screen">
    body {
        background-color:#f0f0f0;
        text-align:center;
     }
    ul {
        display:inline-block;
        padding:0;
        margin:0 0 10p;
        border:1px solid #999;
        list-style-type:none;
        background-color:#fff;
        box-shadow:5px 5px 5px #999;
        text-align:left;
     }
    ul li {
        position:relative;
        line-height:1.8;
     }
    ul li:hover ul {
        display:block;
     }
    ul ul {
        position:absolute;
        display:none;
        width:100%;
        left:-1px;
        border-top:1px solid #fff;
     }
    ul ul li {
        position:relative;
        padding:0;
     }
    ul  a {
        display:block;
        color:#000;
        padding:0 10px;
        text-decoration:none;
     }
    ul a:hover {
        background-color:#333;
        color:#ccc;
     }    
    iframe {
        display:block;
        width:75%;
        margin:auto;
        border:1px solid #999;
        background-color:#fff;
        box-shadow:5px 5px 5px #999;
     }
    </style>
    
    </head>
    <body>
    
    <ul>
     <li><a href="about:blank" target="files"> select a file</a>
      <ul>
       <li><a href="your-folder/file1.txt" target="files">file one</a></li>
       <li><a href="your-folder/file2.txt" target="files">file two</a></li>
       <li><a href="your-folder/file3.txt" target="files">file three</a></li>
     </ul></li>
    </ul>
    
    <iframe name="files"></iframe>
    
    </body>
    </html>
    http://www.htmlhelpcentral.com/messageboard/image.php?type=sigpic&userid=8698&dateline=1189772  724

  3. #3
    Join Date
    Mar 2014
    Posts
    133
    Thanks that works great!

    Also, how would I go about making the text have one of my font styles like this for example:

    Code:
    .DefaultText {
    	font-size: medium;
    	font-weight: normal;
    	font-family: Arial, Helvetica, sans-serif;
    	font-style: normal;
    	font-variant: normal;
    	text-transform: none;
    	color: #FFFFFF;
    }
    And is it possible for the text box to automatically adjust the height to contain all of the text without a scroll bar?

    <3 xoxoxoxo

    You're the best.

  4. #4
    Join Date
    Sep 2007
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    369
    Hi there NZLTruly,


    ...is it possible for the text box to automatically adjust
    the height to contain all of the text without a scroll bar?
    The code that I gave you was a simple "Client Side" example.

    Unfortunately, unless the contents of the "iframe element"
    are on the same domain, the "iframe element" has no way of
    obtaining its contents dimensions.

    If your host provides you with "Server Side" capabilities, such
    as PHP, then I could give you an alternative solution that
    would simply adjust to each file's individual height.

    ...how would I go about making the text have one of
    my font styles like this for example
    Just apply your CSS rules to the appropriate element(s).
    Last edited by coothead; 09-04-2015 at 06:53 PM. Reason: tpynig eorrr
    http://www.htmlhelpcentral.com/messageboard/image.php?type=sigpic&userid=8698&dateline=1189772  724

Similar Threads

  1. New here - Need help with Drop Down Boxes
    By Drury77 in forum Javascript / AJAX / VBScript
    Replies: 12
    Last Post: 03-14-2006, 07:37 PM
  2. Drop down boxes with links
    By Kid_Gamer in forum HTML / XHTML / XML
    Replies: 17
    Last Post: 06-07-2003, 09:26 PM
  3. Auto Drop Boxes
    By Mako Reactor in forum HTML / XHTML / XML
    Replies: 1
    Last Post: 01-20-2003, 01:42 PM
  4. About Drop Down Boxes
    By Abominable in forum HTML / XHTML / XML
    Replies: 1
    Last Post: 05-21-2002, 02:32 PM
  5. drop down scroll boxes
    By cky_bam in forum HTML / XHTML / XML
    Replies: 4
    Last Post: 01-07-2002, 02:53 AM

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
Powered by vBadvanced CMPS v4.1.1