1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Unmaintained iFrame Play with Pages

Using IFrames inside your pages

  1. masterchief

    masterchief Well-Known Member

    masterchief submitted a new resource:

    iFrame Play with Pages - Using IFrames inside your pages

    Read more about this resource...
     
  2. masterchief

    masterchief Well-Known Member

    In the page HTML code replace the UL section with the following code to show buttons instead of links

    Code:
    
    <ul>
    
      <li  style="display: inline-block;  width: 115px; height: 25px; background: #4E9CAF; padding: 10px; text-align: center; border-radius: 5px; color: white; font-weight: bold;"><a href="test.php?do=sampletext" target="iframe1"><span>Sample Text</span></a></li>
    
      <li  style="display: inline-block;  width: 115px; height: 25px; background: #4E9CAF; padding: 10px; text-align: center; border-radius: 5px; color: white; font-weight: bold;"><a href="test.php?do=moresampletext" target="iframe1"><span>More Sample Text</span></a></li>
    
    </ul>
    
    
     
  3. Kintaro

    Kintaro Well-Known Member

    to have buttons instead of links you can use:

    HTML:
    <input type="button" value="TEXT" onclick="TARGET.location.href='LINK'">
     
  4. masterchief

    masterchief Well-Known Member

    NOPE! does not work as you have posted.... please try again

    new button code with help from EQnoble
    HTML:
    <div class="cstmButtonWrap">
      <a class="cstmButtonTxt" href="test.php?do=sampletext" target="iframe1">Sample Text</a>
      <a class="cstmButtonTxt" href="test.php?do=moresampletext" target="iframe1">More Sample Text</a>
    </div>
    
    code for extra.css
    HTML:
    .cstmButtonWrap{
      display: inline-block;
      list-style: none outside none;
      margin: 10px;
    }
    .cstmButtonWrap a:hover {
      text-decoration:none;
    }
    .cstmButtonTxt {
      background-color: @secondaryMedium;
      border-radius: 4px;
      color: #000000;
      padding: 4px;
    }
    .cstmButtonTxt:hover {
      background-color: @secondaryMedium;
      color:#ffffff;
    }
    
     
    Last edited: Nov 27, 2013
  5. Itworx4me

    Itworx4me Well-Known Member

    @masterchief Do you have a demo of this??

    Thanks,
    Itworx4me
     

Share This Page