Tabbed Content and Flash SWF - Việt Mỹ News -->

Breaking

Home Top Ad

Post Top Ad

Tabbed Content and Flash SWF

<!--Tab links-->
<div class="tab">
  <button class="tablinks" id="defaultOpen" onclick="openTab(event, 'Phần 1')">Phần 1</button>
  <button class="tablinks" onclick="openTab(event, 'Phần 2')">Phần 2</button>
  <button class="tablinks" onclick="openTab(event, 'Phần 3')">Phần 3</button>
  <button class="tablinks" onclick="openTab(event, 'Phần 4')">Phần 4</button>
  <button class="tablinks" onclick="openTab(event, 'Phần 5')">Phần 5</button>
  <button class="tablinks" onclick="openTab(event, 'Phần 6')">Phần 6</button>
</div>

<!--Tab content-->
<div class="tabcontent" id="Phần 1">
  <h3>London</h3>
  <p>London is the capital city of England.</p>
</div>

<div class="tabcontent" id="Phần 2">
  <h3>Paris</h3>
  <p>Paris is the capital of France.</p>
</div>

<div class="tabcontent" id="Phần 3">
  <h3>Tokyo</h3>
  <p>Tokyo is the capital of Japan.</p>
</div>

<div class="tabcontent" id="Phần 4">
  <h3>London</h3>
  <p>London is the capital city of England.</p>
</div>

<div class="tabcontent" id="Phần 5">
  <h3>Paris</h3>
  <p>Paris is the capital of France.</p>
</div>

<div class="tabcontent" id="Phần 6">
  <h3>Tokyo</h3>
  <p>Tokyo is the capital of Japan.</p>
</div>


<!--Toggleable Tabs In HTML Start-->
<style>
/* Style the tab */
.tab {
  overflow: hidden;
  border: 1px solid #ccc;
  background-color: #f1f1f1;
}

/* Style the buttons inside the tab */
.tab button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
  font-size: 17px;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #ddd;
}

/* Create an active/current tablink class */
.tab button.active {
  background-color: #ccc;
}

/* Style the tab content */
.tabcontent {
  display: none;
  padding: 6px 12px;
  border: 1px solid #ccc;
  border-top: none;
}
</style> 

<script>
function openTab(evt, tabName) {
  var i, tabcontent, tablinks;
  tabcontent = document.getElementsByClassName("tabcontent");
  for (i = 0; i < tabcontent.length; i++) {
    tabcontent[i].style.display = "none";
  }
  tablinks = document.getElementsByClassName("tablinks");
  for (i = 0; i < tablinks.length; i++) {
    tablinks[i].className = tablinks[i].className.replace(" active", "");
  }
  document.getElementById(tabName).style.display = "block";
  evt.currentTarget.className += " active";
}

  // Get the element with id="defaultOpen" and click on it
document.getElementById("defaultOpen").click();
</script>
<!--Toggleable Tabs In HTML End--></div>



London

London is the capital city of England.

Paris

Paris is the capital of France.

Tokyo

Tokyo is the capital of Japan.

London

London is the capital city of England.

Paris

Paris is the capital of France.

Tokyo

Tokyo is the capital of Japan.



https://www.w3schools.com/howto/howto_js_tabs.asp




Blognews Tabbed

<div id='light_cs'>
<ul class='tabs'>
<li><a href='#one'>Bài mới</a></li>
<li><a href='#two'>Tin đọc nhiều</a></li>
<li><a href='#three'>Phản hồi</a></li>
</ul>
<div class='panes'>
<div class='nd2' id='one'>
Text content 
</div>
<div id='two'>
Text content
</div>
<div id='three'>
Text content
</div>
</div>
</div>
<p align="justify"> </p>

<font style="font-size: 14pt">r</font>

<!--HIDDEN WORDS-->

phóng viên RFA
<a href="http://www.rfa.org/vietnamese" target="_blank"><span style="color: #333333;">Theo <b>RFA</b></span></a>
<a href="http://www.viet.rfi.fr/" target="_blank"><span style="color: #333333;">Theo RFI</span></a>
<a href="http://www.bbc.co.uk/vietnamese" target="_blank"><span style="color: #333333;">Theo <b>BBC</b> </span></a>
<a href="http://www.voatiengviet.com" target="_blank"><span style="color: #333333;">Theo <b>VOA</b></span></a>
<a href="http://boxitvn.blogspot.dk/" target="_blank"><span style="color: #333333">Theo Bauxite Việt Nam</span></a>
<a href="http://www.ethongluan.org/" target="_blank"><span style="color: #333333">ethongluan</span></a>
<a href="http://www.nguoi-viet.com/" target="_blank"><span style="color: #333333">Theo Người việt</span></a>
<a href="http://www.ijavn.org/" target="_blank"><span style="color: #333333">Theo VNTB</span></a>


TABLES  <li class="selected">
<ul class="tabs">
<li><a href="#view1">TIẾNG VIỆT</a></li>
<li><a href="#view2">ENGLISH</a></li>
</ul>
<div class="tabcontents">
<div id="view1">
content 1
</div>
<div id="view2">
content 2
</div>
</div>

Insert zoom picture:
Left side
<div style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;">
<img class="expando" src="*" width="250" /></div>

Right side
<div style="clear: right; float: right; margin-bottom: 1em; margin-left: 1.2em;  margin-right: 5px; box-shadow: 5px 5px 5px #888888;">
<img class="expando" src="*" width="250" /></div>

<div style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;">
<div style="border-top: 8px groove #7b7b7b; margin-bottom: 2px; width: 250px;"></div>
<img class="expando" src="*" width="250" /></div>

<div style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em; margin-right: 5px;">
<img class="magnify" src="#" width="250" /></div>

----------------
Insert zoom picture with boxes

<table align="left" border="0" cellpadding="0" cellspacing="0" style="margin-bottom: auto; margin-right: 1em; width: 250px;"><tbody>
<tr><td ><img class="expando" src=" * " width="250" />
</td></tr>
</tbody></table>

<div style="box-shadow: 5px 5px 5px #888888; clear: right; float: right; margin-bottom: 1em; margin-left: 1em;">

<center><img src="*" width="500" /></center>

<div align="center">
<div style="background: #ffffff; border: solid 0px #aaaaaa; margin: 0px 0; padding: 0px; width: 500px;">
<img src="*" width="500" /></div>
</div>

<span style="color: #333333">   </span>light black

<span style="color: #3d85c6"> light blue </span>

<span style="color: #cc0000"> Red

<div style="border-top: 4px double #C27BA0; margin-top: 1em; padding-top: 1em; width: 280px"> </div>  double liner
<div style="border-top: 1px solid #aaaaaa; margin-top: 1em; padding-top: 1em;"></div>

<hr size="1" align="left" width="100%" color="#e7e7e7">


<hr align="left" noshade="noshade" size="5" width="63%" />

<hr align="left" size="1" width="50%" />

<iframe src="http://www.google.com" style="width: 90%; height: 300px"></iframe>
<iframe width="560" height="800" src="http://www.youtube-mp3.org?wmode=transparent" frameborder="0" allowfullscreen></iframe>

SWF file embeb

<div style="padding-left: 30px;">
<div id="MediaPlayer" style="width:640px; height:465px; vertical-align:top; background:url('http://nguoiviet.tv/images/tv2016.png') no-repeat; padding: 5px 0px 0px 4px;">
<p><iframe width="612" height="399" src="https://docs.google.com/file/d/0B1XHapVNed3mNHhhQUkxRnJvbnM/preview"frameborder="0" allowfullscreen=""></iframe>
</div>

LEFT DOUBLE QUOTATION
&#x201c;

“  &#8220;
▸  &#9656;
►  &#9658;
«  &#171;
»  &#187;
→  &#8594;
®  &#174;
|  &#124; vertical bar
↓  
masculine ordinal    &#186;    &ordm;    º
password dot    &#9679;        ●
bullet    &#8226;        •
■ □ ▪ ▫  &#9632; square
light orange: fdf1e3
Orange: FFE8D9
yellow: fcfaee
Blue: eef9fb

text-align:justify;
font-size:13px;
font-style:italic;
font-family:Arial

-----

<hr align="left" size="1" width="38%" />
<i>Tác giả gửi trực tiếp đến <b><a href="http://www.vanews.org/"><b>VA News</b></a></b></i>

<div style="border-top: 1px solid #aaaaaa; margin-top: 10px; padding-top: 5px; width: 230px;">
<i>Tác giả gửi trực tiếp đến <b><a href="http://www.vanews.org/"><b>VA News</b></a></b></i></div>

<hr align="left" size="1" width="54%" />
<i>Bài do tác giả gởi. <a href="http://www.vanews.org" target="_blank"><span style="color: #333333">VA News</span></a> biên tập và  minh hoạ.</i>

<div style="padding-left: 30px;">
● Các văn kiện một chiều như thế có tầm quan trọng như một hiệp ước lớn, không được</div>

The best video embeb

For.mp4
<center>
<embed allowfullscreen="true" allowscriptaccess="always" flashvars="height=301&amp;width=500&amp;file=http://clubnailspahair.com/video/vn-ambassador.mp4&amp;image=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1XtwGsUrzEbhgsX-gDW493CZ-CQbrddGTV_ykxYNocKpDkrKzGvVOo8TeGP6ck0yiIPGaMmf7oSnJfGM6K0RGHvtMVLgzmuuCxPatnQY50OnwZo8gSYC1F6n_h6lrf6ahX2G9MXLtaos/s1600/vn-ambassador.png&amp;searchbar=false&amp;smoothing=false" height="335" src="http://player.longtailvideo.com/player.swf" width="560"></embed>
</center>

For .flv & mp4
<div align="center" id="container">
<script type="text/javascript">// <![CDATA[
playerFile = "http://www.rfa.org/english/FlashPlayer.swf";
fpFileURL = "http://clubnailspahair.com/video/Enter Pyongyang.mp4";
fpPreviewImageURL="http://www.rfa.org/vietnamese/multimedia/VideoDuongThuHuongonHCM-01222009164459.html/DuongThuHuongonHCm-pic.jpg";
playerSize = "560x335";
videoScreenSize = "560x335";
fpButtonSize = "70x70";
// ]]></script>
<script src="http://www.rfa.org/english/flashplayer.js" type="text/javascript"></script>
</div>

<div style="text-align: center;">
<video controls="controls" height="315" src="http://wsodprogrf.bbc.co.uk/vietnamese/dps/2014/12/afghan_bruce_lee_16x9_lo.mp4" width="560"></video>
</div>

<table align="right" border="0" cellpadding="0" cellspacing="0" style="margin-bottom: auto; margin-left: 1em; width: 250px;"><tbody>
<tr><td><video controls="controls" src="http://wsodprogrf.bbc.co.uk/vietnamese/dps/2014/11/hangout_national_assembly_16x9_lo.mp4" width="250"></video>
</td></tr>
</tbody></table>

For.swf
<center>
<embed align="middle" allowscriptaccess="always" height="333" pluginspage="http://www.macromedia.com/go/getflashplayer" quality="high" src="https://sites.google.com/site/vaolonline/home/swf/myfolder.swf" type="application/x-shockwave-flash" width="500"></embed>
</center>

BBC 300x169 Video frame
<table align="right" border="0" cellpadding="0" cellspacing="0" style="margin-bottom: auto; margin-left: 1em; width: 300px;"><tbody>
<tr align="justify"><td bgcolor="#eceaea"><video controls="controls" height="169" src="http://wsodprogrf.bbc.co.uk/vietnamese/dps/2014/10/viet_pm_scs_16x9_lo.mp4" width="300"></video>
</td></tr>
</tbody></table>

------


Audio with picture logo format

<div align="center">
<div style="background: #ffffff; border: solid 0px #aaaaaa; margin: 0px 0; padding: 0px; width: 560px;">
<img src="*" width="560" /></div>
</div>

Radio + Image + Text right side

<div style="width: 100%;">
<div style="background: #f8f8f8; border: solid 1px #e7e5e5; float: right; margin-bottom: 10px; margin-left: 15px; padding: 0px; text-align: justify; width: 300px;">
<img class="expando" src="#" width="300" />
<div style="background: #fcf8df; border: solid 1px #aaaaaa; font-size: 11px; margin: 0px 0; padding: 5px; text-align: justify;">
Text content</div>
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWG1l6f7v2sSTiB6OR90BTCZfy98PR5i71ngOto1BBKlxb-UBUa2u2-kAuiLYLnv55azlG2H6o0eNdrDWQmOQdIa2Qd6RxULM5vxkFkaMYODI5HnOioewmc4jF-rwwg6nVte0tc7HNUa9Q/s1600/radio-animated300x43.gif" height="36" width="300" />
<audio controls="">
<source src="http://wsodprogrf.bbc.co.uk/vietnamese/dps/2014/12/nguyenlanthang_bolap_edited_141209_nguyenlanthang_bolap_au_bb.mp3" type="audio/mpeg"></source>
</audio></div>
</div>

http://a.files.bbci.co.uk/worldservice/live/assets/images/2014/12/11/141211094937_thich_duc_thien_640x360_internet_nocredit.jpg

-----------

<table align="right" border="2" bordercolor="#d4d2d2" cellpadding="0" cellspacing="0" style="border-collapse: collapse; margin-bottom: .5em; margin-left: 1em; width: 200px;"><tbody>
<tr><td bgcolor="#eceaea"><div style="text-align: center;">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWG1l6f7v2sSTiB6OR90BTCZfy98PR5i71ngOto1BBKlxb-UBUa2u2-kAuiLYLnv55azlG2H6o0eNdrDWQmOQdIa2Qd6RxULM5vxkFkaMYODI5HnOioewmc4jF-rwwg6nVte0tc7HNUa9Q/s1600/radio-animated300x43.gif" height="36" width="200" />
<span style="color: #660000;"><a href="https://www.blogger.com/null"><img class="icon" src="http://www.rfa.org/vietnamese/icon_speaker.gif" /></a> <b>Nghe bài tường thuật</b></span>
<embed allowfullscreen="true" allowscriptaccess="always" flashvars="&amp;file=http://www.rfa.org/vietnamese/in_depth/the-turning-lantern-08142014090540.html/08142014-the-turning-lantern.mp3&amp;
height=20&amp;width=200&amp;showeq=true&amp;autostart=false&amp;
repeat=true&amp;shuffle=false&amp;volume=100" height="20" quality="hight" src="http://player.longtailvideo.com/player.swf" width="200"></embed></div>
</td></tr>
</tbody></table>


------------------ Right side box

<table align="right" border="0" cellpadding="0" cellspacing="0" style="margin-bottom: auto; margin-left: 1em; width: 250px;"><tbody>
<tr align="justify"><td bgcolor="#eceaea"><img class="expando" src="*" width="250" />
</td></tr>
</tbody></table>


Image + Quote Text

<div style="width: 100%;">
<div style="background: #f8f8f8; border: solid 0px #e7e5e5; float: right; margin-bottom: 10px; margin-left: 20px; padding: 0px; text-align: justify; width: 200px;">
<div style="border-top: 10px groove #999999; margin-bottom: 0px; padding: 2px;"></div>
<img class="magnify" src="#" width="200" />
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj025s8epUrDaBdiT8ngOz2si8b72dG_f68t1MI8hjMdHJAwq1RjJC2on-Zlz6JTyc_GI4jhrDmrvORsYiq-7uYrQNbq5EIBwX56DSng0LkgoEGQiv7z2PnEnQ-JHHrW_dl9DE20unyieA/s30/quotes.png" />&nbsp;&nbsp;Text content</div>
</div>

--- Left side

<table align="left" border="0" cellpadding="0" cellspacing="0" style="margin-bottom: auto; margin-right: 1em; width: 250px;"><tbody>
<tr align="justify"><td bgcolor="#eceaea"><img class="expando" src="*" width="250" />
</td></tr>
</tbody></table>

--- Center

<table align="center" border="0" cellpadding="0" cellspacing="0" style="margin-bottom: auto; margin-right: auto; width: 500px;"><tbody>
<tr align="justify"><td bgcolor="#eceaea"><img src="*" width="500" />
</td></tr>
</tbody></table>

<div align="center">
<div style="background: #ffffff; border: solid 0px #aaaaaa; margin: 0px 0; padding: 0px; width: 500px;">
<img src="*" width="500" /></div>
</div>


<span style="color: #333333">

------------------Double lines boxes
Boxes:

<div style="width: 100%;">
<div style="background: #f8f8f8; border: solid 0px #e7e5e5; float: right; margin-bottom: 10px; margin-left: 15px; padding: 0px; text-align: justify; width: 200px;">
<hr align="center" color="#e7e7e7" size="6" width="100%" />
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj025s8epUrDaBdiT8ngOz2si8b72dG_f68t1MI8hjMdHJAwq1RjJC2on-Zlz6JTyc_GI4jhrDmrvORsYiq-7uYrQNbq5EIBwX56DSng0LkgoEGQiv7z2PnEnQ-JHHrW_dl9DE20unyieA/s20/quotes.png" />
<hr align="center" color="#e7e7e7" size="1" width="100%" />
Text content
</div>


Gray background

<div style="width: 100%;">
<div style="background: #f8f8f8; border: solid 0px #e7e5e5; float: right; margin-bottom: 1px; margin-left: 20px; padding: 0px; text-align: justify; width: 200px;">
<div style="border-top: 10px solid #dddddd; margin-bottom: 5px;">
</div>
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj025s8epUrDaBdiT8ngOz2si8b72dG_f68t1MI8hjMdHJAwq1RjJC2on-Zlz6JTyc_GI4jhrDmrvORsYiq-7uYrQNbq5EIBwX56DSng0LkgoEGQiv7z2PnEnQ-JHHrW_dl9DE20unyieA/s30/quotes.png" />&nbsp;&nbsp;Text content »
</div></div>

Green background: #eefef0

<div style="background: #fcf8df; border-radius: 5px; border: double 3px #aaaaaa; font-size: 11px; margin: 20px 0; padding: 5px; text-align: justify; width: 100%;">
Text content
</div>

Box with shardow

<div align="center">
<div style="background: #fcf8df; border-radius: 10px; border: double 3px #aaaaaa; box-shadow: 5px 5px 5px #888888; margin: 20px 0; padding: 15px; text-align: justify; width: 500px;">
Text content</div>
</div>

background: linear-gradient(yellow, red, yellow);
background-image: url("paper.gif");

<div style="width: 100%;">
<div style="background: #fcf8df; border: double 2px #aaaaaa; float: right; margin-bottom: 5px; margin-left: 10px; padding: 5px; text-align: justify; width: 250px;">
Text content</div>
</div>

<table align="right" border="0" cellpadding="0" cellspacing="0" style="margin-bottom: 1em; margin-left: 1.5em; width: 200px;"><tbody>
<tr align="justify"><td><hr size="1" align="left" width="100%" color="#D87302">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj025s8epUrDaBdiT8ngOz2si8b72dG_f68t1MI8hjMdHJAwq1RjJC2on-Zlz6JTyc_GI4jhrDmrvORsYiq-7uYrQNbq5EIBwX56DSng0LkgoEGQiv7z2PnEnQ-JHHrW_dl9DE20unyieA/s20/quotes.png" />
<hr size="1" align="left" width="100%" color="#D87302">
 Text content
</td></tr>
</tbody></table>

---


Bài liên quan

<div style="width: 100%;">
<div style="background: #f8f8f8; border: solid 0px #e7e5e5; float: right; margin-bottom: 10px; margin-left: 15px; padding: 0px; text-align: justify; width: 200px;">
<div style="border-top: 6px solid #fc0000; margin-bottom: 0px; padding: 5px;">
<span style="font-size: 12pt;"><b>Bài liên quan</b></span></div>
<div style="border-top: 2px solid #999999; margin-bottom: 0px; padding: 10px;">
► Bộ trưởng Y tế Việt Nam bị đề nghị từ chức</div>
</div></div>

Radio & bài liên quan

<div style="width: 100%;">
<div style="background: #f8f8f8; border: solid 1px #e7e5e5; float: right; margin-bottom: 10px; margin-left: 15px; padding: 0px; text-align: justify; width: 300px;">
<div style="text-align: center;">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWG1l6f7v2sSTiB6OR90BTCZfy98PR5i71ngOto1BBKlxb-UBUa2u2-kAuiLYLnv55azlG2H6o0eNdrDWQmOQdIa2Qd6RxULM5vxkFkaMYODI5HnOioewmc4jF-rwwg6nVte0tc7HNUa9Q/s1600/radio-animated300x43.gif" height="36" width="300" />
<span style="color: #660000;"><img src="http://www.rfa.org/vietnamese/icon_speaker.gif" /><b>Nghe bài tường thuật</b></span>
<audio controls="">
<source src="http://www.rfa.org/vietnamese/programs/ReadingBlogs/communist-irony-irony-of-hletho-kh-12052014144735.html/12052014-diemblog-kh.mp3" type="audio/mpeg"></source>
</audio></div>
<div style="border-top: 6px solid #fc0000; margin-bottom: 0px; padding: 5px;">
<span style="font-size: 13pt;"><b>Bài liên quan</b></span></div>
<div style="border-top: 2px solid #fc0000; margin-bottom: 0px; padding: 10px;">
► Bộ trưởng Y tế Việt Nam bị đề nghị từ chức</div>
</div>

-----------------------Custom Boxes:
Red:
<table align="right" border="0" cellpadding="0" cellspacing="0" style="height: 25px; margin-bottom: 1em; margin-left: 1em; width: 250px;"><tbody>
<tr><td align="left" style="background-color: #f3b204; height: 8px;" valign="middle"></td></tr>
<tr><td style="background-color: #fae6ab; padding: 10px; text-align: justify;"><span style="color: darkred; font-size: 13px; line-height: 19px;">Trong&nbsp;Báo cáo kết quả giám sát khai quật, đại tá Nguyễn Văn Bình, Đội quy tập K72 của Bộ chỉ huy quân sự Bình Phước, nêu ý kiến: Cùng với Sở LĐ-TB-XH, Đội K72 thống nhất xác định đây không phải là hài cốt. Kiến nghị khai quật lại toàn bộ số hài cốt vừa an táng đem đi giám định ADN để đi kết luận cuối cùng một cách khoa học và chính xác.

Đích thân Phó giám đốc Sở LĐ-TB-XH Bình Phước&nbsp;Võ Văn Mãng hai lần gửi công văn&nbsp;cho Cục Người có công, Bộ LĐ-TB-XH đề nghị giám định ADN và giám định xương cốt nhưng vẫn không có kết quả.</span>
</td></tr>
<tr><td align="left" style="background-color: #f3b204; height: 4px;" valign="middle"></td></tr>
</tbody></table>


<table align="right" border="0" cellpadding="0" cellspacing="0" style="height: 25px; margin-bottom: auto; margin-left: 1em; width: 250px;"><tbody>
<tr><td align="left" style="background-color: #f3b204; height: 8px;" valign="middle"></td></tr>
<tr><td style="background-color: #fae6ab; padding: 10px; text-align: justify;"><span style="color: darkred;">Trong&nbsp;Báo cáo kết quả giám sát khai quật, đại tá Nguyễn Văn Bình, Đội quy tập K72 của Bộ chỉ huy quân sự Bình Phước, nêu ý kiến: Cùng với Sở LĐ-TB-XH, Đội K72 thống nhất xác định đây không phải là hài cốt. Kiến nghị khai quật lại toàn bộ số hài cốt vừa an táng đem đi giám định ADN để đi kết luận cuối cùng một cách khoa học và chính xác.

Đích thân Phó giám đốc Sở LĐ-TB-XH Bình Phước&nbsp;Võ Văn Mãng hai lần gửi công văn&nbsp;cho Cục Người có công, Bộ LĐ-TB-XH đề nghị giám định ADN và giám định xương cốt nhưng vẫn không có kết quả.</span>
</td></tr>
<tr><td align="left" style="background-color: #f3b204; height: 4px;" valign="middle"></td></tr>
</tbody></table>

--------Best video embeb

Best video embeb most using

<center>
<embed allowfullscreen="true" allowscriptaccess="always"
flashvars="height=301&amp;width=500&amp;file=http://clubnailspahair.com/video/vn-ambassador.mp4&amp;
image=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1XtwGsUrzEbhgsX-gDW493CZ-CQbrddGTV_ykxYNocKpDkrKzGvVOo8TeGP6ck0yiIPGaMmf7oSnJfGM6K0RGHvtMVLgzmuuCxPatnQY50OnwZo8gSYC1F6n_h6lrf6ahX2G9MXLtaos/s1600/vn-ambassador.png&amp;
searchbar=false&amp;smoothing=false" height="335" src="http://player.longtailvideo.com/player.swf" width="560"></embed>
</center>


------- Center

<table align="center" border="0" cellpadding="0" cellspacing="0" style="height: 25px; margin-bottom: 1em; margin-left: auto; width: 560px;"><tbody>
<tr><td align="left" style="background-color: #f3b204; height: 8px;" valign="middle"></td></tr>
<tr><td style="background-color: #fae6ab; padding: 10px; text-align: justify;"><span style="color: darkred; line-height: 19px;"><b>Nhà đầu tư nước ngoài than vãn về Triều Tiên</b>

Tờ Chosun Ilbo của Hàn Quốc loan tin Tập đoàn truyền thông Orascom (Ai Cập) đã tạm ngừng đầu tư vào CHDCND Triều Tiên do gặp khó khăn về việc chuyển lợi nhuận khỏi nước này.

Từ năm 2008, Orascom hợp tác với chính quyền Triều Tiên cho ra đời liên doanh Koryolink - nhà mạng di động 3G duy nhất ở miền Bắc - và đến nay đã đầu tư 200 triệu USD. Việc làm ăn khá suôn sẻ khi Koryolink đã thu hút 2 triệu thuê bao và có lợi nhuận cao, nhưng Orascom vẫn chưa hoàn được vốn. Lý do là Triều Tiên không cho phép chuyển lợi nhuận ra ngoài. Reuters dẫn lời Chủ tịch Oarascom Naguib Sawiris khẳng định sẽ không đầu tư thêm cho đến khi nhận được lợi nhuận. Theo Chosun Ilbo, một số doanh nghiệp Trung Quốc hoạt động khai khoáng ở Triều Tiên như Tập đoàn KwangShang và Tập đoàn Seayang cũng phải rút vốn vì lý do tương tự. Bình Nhưỡng chưa có phản ứng về thông tin trên.</span>

<div style="text-align: right;">
<span style="color: #660000;"><b>Ái Thu</b></span></div>
</td></tr>
<tr><td align="left" style="background-color: #f3b204; height: 4px;" valign="middle"></td></tr>
</tbody></table>


Gray:
<table align="right" border="0" cellpadding="0" cellspacing="0" style="height: 25px; margin-bottom: 1em; margin-left: 1.5em; width: 250px;"><tbody>
<tr><td align="left" style="background-color: #d1cfcf; height: 15px;" valign="middle"></td></tr>
<tr><td style="background-color: #f2f1f1; padding: 5px; text-align: justify;"><span style="color: #333333;">Mô hình cai trị ấy ở phương Đông bị thách thức dữ dội khi đứng trước các quốc gia Tây phương thoát đêm đen trung cổ tiến lên một xã hội đại nghị với quyền lực được phân chia mà kiểm soát lẫn nhau. Và quan trọng hơn cả đó là những xã hội được cai trị bằng luật pháp
</span></td></tr>
<tr><td align="left" style="background-color: #d1cfcf; height: 4px;" valign="middle"></td></tr>
</tbody></table>

Blue:
<table align="right" border="0" cellpadding="0" cellspacing="0" style="height: 25px; margin-bottom: 1em; margin-left: 1em; width: 250px;"><tbody>
<tr><td align="left" style="background-color: #3d77b1; height: 15px;" valign="middle"></td></tr>
<tr><td style="background-color: #e3edf7; padding: 10px; text-align: justify;"><span style="color: #333333; font-size: 13px; line-height: 19px;">    <b>Việc dừng khai thác cát hay không, huyện chưa thể khẳng định vì không thuộc thẩm quyền. Trước mắt, chúng tôi tiếp thu ý kiến của bà con, chuyển lên và chờ UBND tỉnh quyết định"</b>

» Chủ tịch UBND huyện Tư Nghĩa
</span></td></tr>
<tr><td align="left" style="background-color: #3d77b1; height: 4px;" valign="middle"></td></tr>
</tbody></table>

-----------------
nice box index

<div class="boxright200" style="background-color: #f5fdf5; color: #333333; float: right; font-family: Verdana, Arial, Tahoma, sans-serif; font-size: 12px; line-height: 16.796875px; margin: 5px 0px 5px 15px; outline: 0px; overflow: hidden; padding: 0px; text-align: justify; width: 200px;">
<div class="quotebody" style="font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; font-weight: bold; line-height: 1.3em; margin: 0px; outline: 0px; padding: 10px 10px 5px;">
<div class="quoteopen" style="float: left; height: 12px; margin: 0px 5px 0px 0px; outline: 0px; padding: 0px;">
</div>
<div style="margin-bottom: 10px; margin-top: 10px; outline: 0px; padding: 0px;">
Vậy theo sở kiến hẹp hòi của kí giả, nên theo chỗ thông thường trên đường sống hiện tại mà chỉ dẫn cho họ, như chuyện xảy ra trong xứ mà tiếp xúc mật thiết với sự sống của họ, chuyện phù thu lạm bổ trong hương thôn, lạm quyền trái phép của kẻ thừa hành công việc và những tấn kịch lường công bớt gạo của bọn tư sản. Chỉ vạch cho họ giác ngộ, sau mới dẫn tiến lên đường mới. Nếu không chăm vào chỗ cần thiết đó mà đem những học thuyết cao xa đó kêu gào hàng ngày, nói gần bình dân mà kì thực cách xa họ đến muôn ngàn dặm!&nbsp;</div>
</div>
<div style="text-align: right;">
» Phan Bội Châu</div>

</div>

--------------

Windows Player code

<EMBED type='application/x-mplayer2'
pluginspage='http://microsoft.com/windows/mediaplayer/ en/download/'
id='mediaPlayer' name='mediaPlayer' displaysize='4' autosize='0'
EnableContextMenu='0' bgcolor='darkblue' showcontrols='1' showtracker='1'
showdisplay='0' showstatusbar='1' videoborder3d='0' width="240" height="65"
src="http://clubnailspahair.com/audio/Ngay Tet Que Em.mp3" autostart='1' designtimesp='5311' loop='1'></EMBED>

--------------------------------------

Audio with Table box code

<table width="400" border="0" cellspacing="5" cellpadding="5" align="left">
<tbody>
<tr>
<td valign="center" bgcolor="#cfe6f9"><span style="color: #686868;"><span style="color: #fafafa;"><span style="color: #030303;"><span style="color: #993300;"><strong>Nghe âm thanh cuộc phỏng vấn</strong></span>
<object width="400" height="27" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param name="flashvars" value="audioUrl=http://sd-2.archive-host.com/membres/playlist/63356026534402341/Midas.mp3" /><param name="quality" value="best" /><param name="src" value="http://www.google.com/reader/ui/3523697345-audio-player.swf" /><embed width="400" height="27" type="application/x-shockwave-flash" src="http://www.google.com/reader/ui/3523697345-audio-player.swf" flashvars="audioUrl=http://sd-2.archive-host.com/membres/playlist/63356026534402341/Midas.mp3" quality="best" /></object></span></span></span></td>
</tr>
</tbody>
</table>

------------------------------------------

audio code
<embed src="http://player.longtailvideo.com/player.swf" allowscriptaccess="always" allowfullscreen="true" quality="hight" flashvars="&amp;file=http://sd-2.archive-host.com/membres/playlist/63356026534402341/12.mp3&amp;
height=20&amp;width=200&amp;showeq=true&amp;autostart=false&amp;
repeat=true&amp;shuffle=false&amp;volume=100" height="20" width="200">

---
<audio controls>
<source src="http://clubnailspahair.com/audio/mot-chut-qua-cho-que-huong.mp3" type="audio/mpeg"></source>
Your browser does not support the audio element.
</audio>

<audio controls>
  <source src="horse.mp3" type="audio/mpeg">
  <source src="horse.ogg" type="audio/ogg">
  <embed height="50" width="100" src="horse.mp3">
</audio>

Quicktime
<object height="20" width="200" autoplay="false" data="http://clubnailspahair.com/audio/mot-chut-qua-cho-que-huong.mp3">
</object>

--------------------------------
Link vượt tường kữa

http://webwarper.net/ww/vanganh.info/

---------------------

Windows player full code...

<OBJECT id='mediaPlayer' width="320" height="310"
classid='CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95'
codebase='http://activex.microsoft.com/activex/controls/ mplayer/en/nsmp2inf.cab#Version=5,1,52,701'
standby='Loading Microsoft Windows Media Player components…' type='application/x-oleobject'>
<param name='fileName' value="http://clubnailspahair.com/audio/Ngay Tet Que Em.mp3">
<param name='animationatStart' value='1'>
<PARAM NAME="EnableContextMenu" VALUE="0">
<param name='transparentatStart' value='0'>
<param name='autoStart' value='1'>
<param name='ShowControls' value='1'>
<param name='ShowDisplay' value='0'>
<param name='ShowStatusBar' value='1'>
<param name='loop' value='1'>


  <EMBED type='application/x-mplayer2'
pluginspage='http://microsoft.com/windows/mediaplayer/ en/download/'
id='mediaPlayer' name='mediaPlayer' displaysize='4' autosize='0'
EnableContextMenu='0' bgcolor='darkblue' showcontrols='1' showtracker='1'
showdisplay='0' showstatusbar='1' videoborder3d='0' width="320" height="310"
src="http://clubnailspahair.com/audio/Ngay Tet Que Em.mp3" autostart='1' designtimesp='5311' loop='1'>
</EMBED>


---------------------------


In the <head>:

  <link href='http://vjs.zencdn.net/4.1/video-js.css' rel='stylesheet'/>
<script src='http://vjs.zencdn.net/4.1/video.js'/>

In the <body>:

<div style="text-align: center;">
<video id="my_video_1" class="video-js vjs-default-skin" controls
 preload="auto" width="560" height="315" poster="my_video_poster.png"
 data-setup="{}">
 <source src="http://www.mrestuary.com/ftp002/video/Japan-Tsunami.mp4" type='video/mp4'>
 <source src="my_video.webm" type='video/webm'>
</video></div>


-----------------------
Điểm Tin Hàng Ngày

<table align="center" border="1" cellpadding="10" cellspacing="3" style="width: 580px;"><tbody>
<tr> <td bgcolor="#cfe6f9"><span style="color: #660000;"><span style="font-size: large;"><b>Điểm Tin Hàng Ngày</b></span></span>

<b><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXwS3e_fZmGoxfXyWRk0wDRASfD3UMFy6eQiIve1QHETqBTvvvB1fHwmZuVtCYyaehIU30uf8dUKs-KhF4P05Vi4_8rGiMRdwFtWpgW8VCL278t_Pv5XuV-YEtFfre4RLtISz-N_P5wm19/s1600/vaol_banner.jpg" style="clear: left; color: #333333; float: left; margin-bottom: 1em; margin-right: 1em; text-decoration: none;"><img border="0" height="70" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXwS3e_fZmGoxfXyWRk0wDRASfD3UMFy6eQiIve1QHETqBTvvvB1fHwmZuVtCYyaehIU30uf8dUKs-KhF4P05Vi4_8rGiMRdwFtWpgW8VCL278t_Pv5XuV-YEtFfre4RLtISz-N_P5wm19/s200/vaol_banner.jpg" style="background-color: #f3f3f3; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; border: 1px solid rgb(221, 221, 221); margin: 0px; max-width: 600px; padding: 5px;" width="200" /></a><b>Chú ý: Tin được đưa lên mạng lúc 08h sáng và cập nhật bổ Sung lúc 13-14h và tin tối lúc 20-21h hàng ngày.</b><span style="color: red;"><b> "Các Bạn cần mở chương trình phần mềm vượt tường lửa để xem những trang bị ngăn chận."</b></span></b></td> </tr>
</tbody> </table>

----

<div style="padding-left: 30px;">
<div class="separator" style="clear: both; text-align: center;">
<span id="goog_775908339"></span><span id="goog_775908340"></span></div>
<div class="separator" style="clear: both; text-align: center;">
<a class="zoom" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisTNQ1ZBRkT3IZk8ylGe83-i4-1PLXF9eyqYk-bpOeFj7iPBo6ywxIZYYoXHPo-MPRGy0kNuVHVkmbWO73euevqiq99c8T6P9MEUvix30Rkg-iZdfUYRjs2myvb3l4EcJbh-BwLo3ip1rc/s1600/diemtin-hangangay.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisTNQ1ZBRkT3IZk8ylGe83-i4-1PLXF9eyqYk-bpOeFj7iPBo6ywxIZYYoXHPo-MPRGy0kNuVHVkmbWO73euevqiq99c8T6P9MEUvix30Rkg-iZdfUYRjs2myvb3l4EcJbh-BwLo3ip1rc/s200/diemtin-hangangay.jpg" width="163" /></a></div>




<b><b>&nbsp;</b></b><span style="color: #660000;"><span style="font-size: large;"><b>&nbsp;</b></span></span>
<span style="color: #660000;"><span style="font-size: large;"><b>Điểm Tin Hàng Ngày</b></span></span>
<b><b>Chú ý: Tin được đưa lên mạng lúc 08h sáng và cập nhật bổ Sung lúc 13-14h và tin tối lúc 20-21h hàng ngày.</b><span style="color: red;"><b> "Các Bạn cần mở chương trình phần mềm vượt tường lửa để xem những trang bị ngăn chận."</b></span></b></div>



<hr noshade="noshade" size="5">

------------------------
no copy

<body oncontextmenu='return false'>
  ...
</body>



----------------------
Flash player embed code (.swf)

<center>
<object><embed src="http://www.chinaswitch.com/caoka/jieri/newyear/zsc112.swf" quality="high" wmode="transparent" type="application/x-shockwave-flash" width="640" height="465"></object></center>
----------------
insert video and youtube cobe


<iframe allowfullscreen="1" class="video-iframe" frameborder="0" height="315" src="http://www.youtube.com/embed/VHcRQ-6RNJQ?feature=oembed&amp;autoplay=0&amp;wmode=opaque&amp;rel=0&amp;showinfo=0&amp;modestbranding=1&amp;version=3&amp;ps=docs&amp;nologo=1&amp;theme=light&amp;color=white&amp;iv_load_policy=0&amp;cc_load_policy=0" width="560"></iframe>

<iframe allowfullscreen="1" class="video-iframe" frameborder="0" height="315" src="http://www.youtube.com/embed/k-5CZCZOgTY?feature=oembed&amp;autoplay=0&amp;wmode=opaque&amp;rel=0&amp;showinfo=0&amp;modestbranding=1&amp;version=3&amp;ps=docs&amp;nologo=1&amp;theme=light&amp;color=white&amp;iv_load_policy=0&amp;cc_load_policy=0" width="560"></iframe>


<iframe allowfullscreen="1" class="video-iframe" frameborder="0" height="420" src="http://www.youtube.com/embed/1PmGxEXP_A8?feature=oembed&amp;autoplay=0&amp;wmode=opaque&amp;rel=0&amp;showinfo=0&amp;modestbranding=1&amp;version=3&amp;ps=docs&amp;nologo=1&amp;theme=light&amp;color=white&amp;iv_load_policy=0&amp;cc_load_policy=0" width="560"></iframe><br />


------
Picture slideshow

<div style="text-align: center;">
<b>Rvolve Zoompics Carousel</b>
<!-- Put this script line in header if you can --><script src="http://vanganh-info.googlecode.com/files/carousel-0.5.js" type="text/javascript"></script>

<!-- Include one div for each carousel -->                      
<div class="zoompic-multi" data-border="1px #aaa solid" data-height="300" data-width="500" id="myzoommulti">
<span data-src="http://rvolve.com/images/carousel/zoom1.jpg"></span>  
<span data-src="http://rvolve.com/images/carousel/zoom2.jpg"></span>
<span data-src="http://rvolve.com/images/carousel/zoom3.jpg"></span>
</div>
</div>

-----
picture zoom <b>Rvolve Zoompics</b>

<div style="text-align: center;">
<!-- Put this script line in header if you can --><script src="http://rvolve.com/js/zoom-pic-intro-3.1.js" type="text/javascript"></script>

<!-- Include one div for each zoompic -->                      
<div class="zoompic" data-animate="true" data-height="312" data-src="http://rvolve.com/images/zoomdemo0.jpg" data-width="500" data-zoomicon="gray" id="my_zoom1">
</div>
</div>


------

Google audio embeb

<div>
<script src="//www.gmodules.com/ig/ifr?url=http://hosting.gmodules.com/ig/gadgets/file/101762205312958577209/nplayer17_0.xml&up_file= http://sites.google.com/site/vaolonline/mp3/diemkeunoptien.mp3%3Fattredirects%3D0&up_wmode=transparent&up_bgcolor=%23ffffff&up_as=0&synd=open&w=200&h=37&border=%23ffffff%7C3px%2C1px+solid+%23999999&output=js"></script>
</div>

<div>
<script src="//www.gmodules.com/ig/ifr?url=http://hosting.gmodules.com/ig/gadgets/file/101762205312958577209/nplayer17_0.xml&up_file= http://sites.google.com/site/vaolonline/mp3/diemkeunoptien.mp3%3Fattredirects%3D0&up_wmode=transparent&up_bgcolor=%23ffffff&up_as=0&synd=open&w=200&h=37&border=%23ffffff%7C0px%2C0px+&output=js"></script>
</div>


<embed name="flashplayer" src="http://sites.google.com/site/vaolonline/home/swf/player3.swf" flashvars="file=http://www.youtube.com/watch?v=eElHGPML1_4&amp;autostart=false&amp;volume=100" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" height="354" width="540">


Picture frame & audio frame

<table align="left" border="0" cellpadding="0" cellspacing="0" style="margin-bottom: auto; margin-right: 1em; width: 250px;"><tbody>
<tr align="justify"><td><img class="expando" src=" * " width="250" />
</td></tr>
</tbody></table>
<table align="right" border="2" bordercolor="#d4d2d2" cellpadding="0" cellspacing="0" style="border-collapse: collapse; margin-bottom: .5em; margin-left: 1em; width: 150px;"><tbody>
<tr><td bgcolor="#eceaea"><div style="text-align: center;">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWG1l6f7v2sSTiB6OR90BTCZfy98PR5i71ngOto1BBKlxb-UBUa2u2-kAuiLYLnv55azlG2H6o0eNdrDWQmOQdIa2Qd6RxULM5vxkFkaMYODI5HnOioewmc4jF-rwwg6nVte0tc7HNUa9Q/s150/radio-animated300x43.gif" height="22" width="150" />
<a href="https://www.blogger.com/null"><img class="icon" src="http://www.rfa.org/vietnamese/icon_speaker.gif" /></a> Nghe bài này
<embed allowfullscreen="true" allowscriptaccess="always" flashvars="&amp;file=http://www.rfa.org/vietnamese/in_depth/vn-needs-act-at-once-or-too-late-tt-06142014074524.html/thanhtruc06142014.mp3&amp;
height=20&amp;width=200&amp;showeq=true&amp;autostart=false&amp;
repeat=true&amp;shuffle=false&amp;volume=100" height="20" quality="hight" src="http://player.longtailvideo.com/player.swf" width="150"></embed></div>
</td></tr>
</tbody></table>


audio zoom w/image
<div style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;">
<img class="expando" src=" * " width="250" />
<div style="text-align: center;">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWG1l6f7v2sSTiB6OR90BTCZfy98PR5i71ngOto1BBKlxb-UBUa2u2-kAuiLYLnv55azlG2H6o0eNdrDWQmOQdIa2Qd6RxULM5vxkFkaMYODI5HnOioewmc4jF-rwwg6nVte0tc7HNUa9Q/s1600/radio-animated300x43.gif" height="36" width="250" />
<span style="color: #660000;">∇ <b>Bấm vào để nghe bài tường thuật</b></span>
<embed allowfullscreen="true" allowscriptaccess="always" flashvars="&amp;file=http://www.rfa.org/vietnamese/in_depth/inspi-fr-pris-dtm-hanh-06302014051957.html/06302014-inspi-fr-pris-dtm-hanh.mp3&amp;
height=20&amp;width=200&amp;showeq=true&amp;autostart=false&amp;
repeat=true&amp;shuffle=false&amp;volume=100" height="20" quality="hight" src="http://player.longtailvideo.com/player.swf" width="250"></embed></div>
</div>

audio zoom w/image box
<table align="left" border="1" bordercolor="#ddddd" cellpadding="0" cellspacing="0" style="margin-bottom: 5px; margin-right: 1em; width: 250px;"><tbody>
<tr align="justify"><td bgcolor="#eceaea"><div style="text-align: center;">
<img class="expando" src=" * " width="250" />
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWG1l6f7v2sSTiB6OR90BTCZfy98PR5i71ngOto1BBKlxb-UBUa2u2-kAuiLYLnv55azlG2H6o0eNdrDWQmOQdIa2Qd6RxULM5vxkFkaMYODI5HnOioewmc4jF-rwwg6nVte0tc7HNUa9Q/s1600/radio-animated300x43.gif" height="36" width="250" />
<span style="color: #660000;">∇ <b>Bấm vào để nghe bài tường thuật</b></span>
<embed allowfullscreen="true" allowscriptaccess="always" flashvars="&amp;file=http://www.rfa.org/vietnamese/in_depth/young-union-activist-released-ta-06282014113035.html/tuongan06282014.mp3&amp;
height=20&amp;width=200&amp;showeq=true&amp;autostart=false&amp;
repeat=true&amp;shuffle=false&amp;volume=100" height="20" quality="hight" src="http://player.longtailvideo.com/player.swf" width="250"></embed></div>
</td></tr>
</tbody></table>



Đồng hồ Hoa Sen code - SWF
<center><embed src="http://d.violet.vn/uploads/resources/612/hoasen1.swf"width="300" height="300" quality="high" name="calendar" align="middle" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed></center>

Digital clock
<embed src=http://flash-clocks.com/free-flash-clocks-blog-topics/free-flash-clock-193.swf width=190 height=100 wmode=transparent type=application/x-shockwave-flash></embed>



Tabbed Content


release v 2013.7.6
Lots of content? Little space? Tabbed Content comes to the rescue. This Javascript component lets you easily create tabbed content. All you need is "ul li" elements and a couple of related content divs.



  • Free  to use
     
  • Javascript (packed 3KB) driven. Search engine friendly.
  • On DOM ready
    Start the tab content on DomContentLoaded instead of window.onload.
  • Persistence
    You can optionally choose if the most recently clicked tab will be remembered during your navigation.
  • Default Tab
    You can specify which tab should be shown by default when the page loads.
  • Multiple Tab Contents
    Support multiple Tab Contents on the same page, with only one copy of the CSS and Javascript files.
  • Valid HTML/HTML5 markup
    Wide browser support (including IE 6)
  • Download the source code by clicking the Download button at the top of this page, and put the downloaded tabcontent.js file and one of the template folders into your web application.
  • Insert the tabcontent.js and tabcontent.css links into the head section of your page

    <!--Tabcontent-->
      <script src='http://www.menucool.com/tab-content/tabcontent.js' type='text/javascript'/>
      <link href='http://www.menucool.com/tab-content/template1/tabcontent.css' rel='stylesheet' type='text/css'/>
    <!--End Tabcontent-->

    <script src='http://yourjavascript.com/116217402401/tabcontent.js' type='text/javascript'/>
  • Add the tabs HTML and contents HTML to your page:

    <ul class="tabs">
    <li><a href="#view1">Features</a></li>
    <li><a href="#view2">How to Use</a></li>
    <li><a href="#view3">Source Code</a></li>
    </ul>
    <div class="tabcontents">
    <div id="view1">
    content 1
    </div>
    <div id="view2">
    content 2
    </div>
    <div id="view3">
    content 3
    </div>
    </div>
  • Set Persistence (optional)
    Add data-persist="true" to the root UL element:
    <ul class="tabs" data-persist="true">
    It will turn on the persistence feature:
    the most recently clicked tab will be remembered even if the page is reloaded or revisited within the browser session.
  • Set Default Tab (optional)
    By default the first tab will be selected when the page is loaded. To override this, set class="selected" to the tab (LI element) that should be shown:
    <li class="selected">Tab 3</li>
Done. That's it.


If you need more features:

We have an advanced version, McTabs - jQuery Tabs, that is the most feature-rich Tabs.
  • Ajax content
  • Smooth transitional effect
  • Auto advance
  • Bookmark support: select a tab via bookmark anchor
  • URL support: a hash id in the URL can select a tab
  • Select tabs by mouse over
  • ... and more
Click on the Download button at the top of the page. It contains the source code, templates and a demo page of the Tab Content UI component.


Flash clock





Lotus flash clock





https://sites.google.com/site/vaolonline/home/swf/Xmax-Newyear.swf
New year



Text content

Không có nhận xét nào:

Đăng nhận xét

Post Bottom Ad