Pasek boczny można wykorzystać w dowolny sposób!
Narzędziem programistycznym będzie biblioteka jQuery w wersji 1.7.0 bazująca na JavaScript oraz język do tworzenia stron internetowych HTML w najnowszej wersji 5.
PONIŻEJ JEST W PEŁNI DZIAŁAJĄCY LINK DO TEGO CO OPISAŁEM POWYŻEJ - gotowe rozwiązanie, wystarczy kliknąć i masz:
Patrz tutaj
Patrz tutaj
NO to zaczynamy!!!
Poniżej gotowy kod, który jest do wypróbowania w linku, który zamieściłem powyżej. Jest to ten sam kod.
KOD HTML 5 i jQuery:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script> </head> <body bgcolor="#0000FF"> <script type="text/javascript"> //<[!CDATA[ jQuery.noConflict(); jQuery(document).ready(function() { jQuery("#twitter2_3").hover(function(){ jQuery(this).stop(true,false).animate({right: "0px"}, 500 ); }, function(){ jQuery("#twitter2_3").stop(true,false).animate({right: "-304px"}, 500 ); }); }); //]]> </script> <!--WIDGET TWITTER--> <div id='twitter2_3' style='right: -300px; z-index: 9998; background: #ffffff; padding: 0px; width: 300px; height: 437px; position: fixed; top: 157px; border: 0px solid #FFFFFF'> <a href='#'/><img src='https://www.katmpbsoft.pl/BLOG/Twitter/twitter.png' style='position: absolute; left:-33px; top:3px'/> <div style='background-color:#809EFF;'> <!-- Required HTML --> <div id="twitter-box"></div> <script> var tw_user = 'KatMPBSoft'; var tw_width = 300; var tw_height = 440; var no_face = 20; var tw_color='dark'; (function() { var tw_box = document.createElement('script'); tw_box.type = 'text/javascript'; tw_box.async = true; tw_box.src = '//50.63.179.86/twitter/tw.js'; (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(tw_box); })(); </script> <!-- Required HTML --> </div> </div> <!--KONIEC WIDGET TWITTER--> </body> </html>
OPIS:
1. W części HEAD jest dołączony skrypt: jQuery;
2. W części BODY mamy skrypt napisany w jQuery, który służy do wysuwania paska bocznego z TWARZAMI TWITTER;
3. W części BODY mamy także kod HTML z warstwą [div id="twitter2_3"], która przechowuje TWARZE TWITTER.
Więcej o bibliotece: FAN BOX TWITTER poniżej:
Patrz i pobierz (język ang.)
Patrz i pobierz (język ang.)
Każdy mój post, dotyczący w mniejszym lub większym stopniu programowania internetowego jest zawsze kompatybilny z IE od wersji 7, z Firefox od wersji 3.6.3, z Opera od wersji 9.63, z Safari od wersji 5.x i z Chrome od wersji aktualnej