Witam,

prosiłbym o pomoc w modyfikacji skryptu wysuwanego panelu

[PHP] pobierz, plaintext 
<style type="text/css">
#tab {
   width: 200px;
   height: 300px;
   position: fixed;
   top: 100px;
   background-color: #fff;
   border: 5px solid #3B5997;
   left: -210px;
}
#tab:after{
   content: url('http://www.no-limit.pl/przycisk.png');
   position: absolute;
   right: -32px;
   top: -5px;
   cursor: pointer;
}
 
#tab:hover {
   left: 0;
}
</style>
<script type="text/javascript">
$(function () {
   var tab = $('#tab'), ow = tab.outerWidth();
   tab.css('left', -ow).hover(function () {
      $(this).stop().animate({left: 0}, 500);
   }, function () {
      $(this).stop().animate({left: -ow}, 500);
   });
});
</script>
<div id="tab">Tutaj dowolna treść</div>
[PHP] pobierz, plaintext 

Problem polega na tym, że panel wysuwa się od lewej strony i nieważne jakbym nie kombinwał - nie mogę przerobić go na prawostronny box.

Obiekt musi mieć pozycję absolute ponieważ wisi na stronie, która skaluje się na 100% i być w określonym miejscu (przy prawej krawędzi).


Poradzi ktoś coś? ;]
Z góry dzięki

A tak?:

[HTML] pobierz, plaintext 
<style type="text/css">
#tab {
   width: 200px;
   height: 300px;
   position: fixed;
   top: 100px;
   background-color: #fff;
   border: 5px solid #3B5997;
   right: -210px;
}
#tab:after{
   content: url('http://www.no-limit.pl/przycisk.png');
   position: absolute;
   right: 100%;
   top: -5px;
   cursor: pointer;
}
 
#tab:hover {
   right: 0;
}
</style>
<script type="text/javascript">
$(function () {
   var tab = $('#tab'), ow = tab.outerWidth();
   tab.css('right', -ow).hover(function () {
      $(this).stop().animate({right: 0}, 500);
   }, function () {
      $(this).stop().animate({right: -ow}, 500);
   });
});
</script>
<div id="tab">Tutaj dowolna treść</div>
[HTML] pobierz, plaintext 

Działa, dzięki wielkie

Nie ma sprawy, zaraz kliknę sobie "pomógł"

[PHP] pobierz, plaintext 
<?php 
echo "<li><iframe src=\"http://portalradiowy.pl/includes/generatory/statystyki/styl5/staty.php?ip=s1.slotex.pl&port=7530&style=&time=5\" width=\"188\" height=\"150\" scrolling=\"no\" style=\"overflow:hidden; margin-top:+50px; margin-left:-50px; border:none;\"></iframe></li>";
echo " <style type='text/css'>\n";
echo "    #tab {\n";
echo "    width: 500px;\n";
echo "    height: 200px;\n";
echo "    position: fixed;\n";
echo "    top: 100px;\n";
echo "    background-color: #fff;\n";
echo "    border: 5px solid #3B5997;\n";
echo "    right: -210px;\n";
echo "    }\n";
echo "    #tab:after{\n";
echo "    content: url('http://www.promixradio.cba.pl/images/przyciskramowka.png');\n";
echo "    position: absolute;\n";
echo "    right: 100%;\n";
echo "    top: -5px;\n";
echo "    cursor: pointer;\n";
echo "    }\n";
echo "     \n";
echo "    #tab:hover {\n";
echo "    right: 0;\n";
echo "    }\n";
echo "    </style>\n";
echo "    <script type='text/javascript'>\n";
echo "    $(function () {\n";
echo "    var tab = $('#tab'), ow = tab.outerWidth();\n";
echo "    tab.css('right', -ow).hover(function () {\n";
echo "    $(this).stop().animate({right: 0}, 500);\n";
echo "    }, function () {\n";
echo "    $(this).stop().animate({right: -ow}, 500);\n";
echo "    });\n";
echo "    });\n";
echo "    </script>\n";
echo "    <div id='tab'><iframe src=\"http://promixradio.panelradiowy.pl/embed.php?script=ramowka2\" scrolling=\"auto\" border=\"0\" marginwidth=\"0\" marginheight=\"0\" frameborder=\"no\" width=\"490\" height=\"200\"></iframe>\n";
?>
[PHP] pobierz, plaintext 

a jak zrobic w php zeby wstawic ten kod ale x 3 bo nakladaja sie na siebie obnizenie tez nic nie pomaga:)

Zamiast trzech elementów o takim samym id, musisz mieć, na przykład, 3 elementy o 3 różnych id i każdy musi mieć inną wartość dla "top".

jestem ciemy wiec jak mozna mozna jasniej ucze sie i chcial bym o wyjasnienie ja to zrobic