iFrame Play with Pages

[masterchief]

masterchief submitted a new resource:

iFrame Play with Pages - Using IFrames inside your pages

Sample html code for your page

<div class="baseHtml">

<?php
  include ("test.php");
?>

<ul>

  <li><a href="test.php?do=sampletext" target="iframe1"><span>Sample Text</span></a></li>
  <li><a href="test.php?do=moresampletext" target="iframe1"><span>More Sample Text</span></a></li>

</ul>

<iframe
  name="iframe1"
  src=""
  width="800"
  height="450"
  frameborder="0">

  Frames are not supported on your browser

</iframe>

</div>

Read more about this resource...

 

[masterchief]

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

<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>

 

[Kintaro]

to have buttons instead of links you can use:

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

 

[masterchief]

to have buttons instead of links you can use:

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

new button code with help from EQnoble

<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

.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;
}

 

[Itworx4me]

@masterchief Do you have a demo of this??

Thanks,
Itworx4me