PaTRoN Admin
Mesaj Sayısı : 411 Teşekkür Edilen Sayısı.. : 994 Rep Gücü : 18 Kayıt tarihi : 05/01/10 Yaş : 27 Nerden : Nereye :)
| Konu: Yazılara degişik bir uygulama Cuma Şub. 05, 2010 11:21 am | |
| Yazının önce küçük bir kısmını gösterip linke tıklanması ile tüm hepsinin görüntülenmesini sağlayabileceğiniz örnek bir javascrıpt uygulaması. - Kod:
-
<script type="text/javascript"> /* This script and many more are available free online at The JavaScript Source!! http://kanalbizim.tr.gg Created by: Kanalbizim | http://www.kanalbizim.tr.gg/under: U.S. Copyright */
function FlipDisplay(d1,d2) { if(document.getElementById(d1).style.display == "none") { document.getElementById(d1).style.display = ""; document.getElementById(d2).style.display = "none"; } else { document.getElementById(d1).style.display = "none"; document.getElementById(d2).style.display = ""; } } </script>
<style> .testimonialNormalFlow { border:1px #666666 dashed; padding:10px; width: 180px; font: .8em verdana, arial, helvetica, sans-serif; }
p.testimonial { margin:0; font-weight:bold; background-color:#efefef; padding:3px; letter-spacing:3px; font-size:larger; text-align:center; }
p.collapseTitle { margin:0; text-align:right; font-size: .8em; margin-top: -10px; } </style>
<!-- Start of testimonial container div --> <div class="testimonialNormalFlow"> <p class="testimonial">Testimonial</p>
<!-- Start of collapsed content div --> <div id="testimonialA"> <p> Loved the script! </p> <p class="collapseTitle"> <a href="javascript:FlipDisplay('testimonialA','testimonialB')">[more ...]</a> </p> </div> <!-- End of collapsed content div -->
<!-- Start of expanded content div --> <div id="testimonialB" style="display:none;"> <p> Really sweet!</p> <p> Cras lectus sociosqu platea diam ac. Eni ve sollicitudin rhoncus, justo pede aliquet, a, lectus urna quam.</p> <p> Eu porta mattis id nulla consequat vestibulum conubia dis. Nulla cubilia cras, id lacus eni risus ridiculus leo facilisi.</p> <p>Laculis<br><a href="http://javascript.internet.com/">JavaScript Source</a></p> <p class="collapseTitle"> <a href="javascript:FlipDisplay('testimonialA','testimonialB')">[close]</a> </p> </div> <!-- End of expanded content div -->
</div> <!-- End of testimonial container div --> | |
|