Wysuwany Panel boczny

1.6.12:

Witam wszystkich

Postanowiłem sobie zrobić wysuwany panel boczny który opiera się na 'silniku' Facebooka, i który ma mi służyć do ogłoszeń - wszystko ładnie działa a problem polega na tym ze w momencie dodania graficznej ikonki/obrazka ogłoszenia bez względu na ustawienia 'img scr' ikonka/obrazek wędruje do lewej strony



Kod znajdujący się w szablonie ( Str.Glowna) :

<div id="ogloszenie">
<img src="images/ogloszenie.png" />
  

<a href="odnosnik do forum"><b><font color="#FF6666">Ogloszenie</font></b></a>
<a href="odnosnik do forum "><b><font color="#FF6666">Tutaj przykladowe Ogloszenie  </font></b></a>
  <img src="http://www.jugojuice.com/assets/dollar_sign_icon.jpg" />
</div>

Kod CSS:

#ogloszenie
{
    width:279px;
    height:150px;
    position: fixed;
    top: 300px;
    right: -240px;
    overflow: hidden;
    z-index:999;
line-height: 30px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: px;
overflow: hidden;
background: #383838;
margin: 10px 0;
font-size: 8pt;
vertical-align: middle;
}



#ogloszenie img
{

    float: left;
    
}

Js :

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/prototype/1.6.0.2/prototype.js"></script>
    <script type="text/javascript" src="http://click-jpa-demo.googlecode.com/svn-history/r12/trunk/war/click/prototype/effects.js"></script>
<script type="text/javascript">
    var animating = false,
        effect_in = false,
        effect_out = false;
        
    Event.observe(window, 'load', function()
        {
            Event.observe($('ogloszenie'), 'mouseover', function()
            {
                if( typeof effect_out == 'object' )
                {
                    effect_out.cancel();
                }
                effect_in = new Effect.Morph('ogloszenie',
                    {
                        style: {
                            right: '-2px'
                        },
                        transition: Effect.Transitions.spring
                    }
                );
            });
            
            Event.observe($('ogloszenie'), 'mouseout', function()
            {
                
                if( typeof effect_in == 'object' )
                {
                    effect_in.cancel();
                }
                effect_out = new Effect.Morph('ogloszenie',
                    {
                        style: {
                            right: '-240px'
                        },
                        transition: Effect.Transitions.spring
                    }
                );
            });
        }
    );
</script>

Snake_ napisał 14.05.2014, 14:42:
Przenoszę do właściwego działu. Zapoznaj się z:

No przecież masz float: left dla img więc?

Sam pisałeś ten kod?

No przecież masz float: left dla img więc?

Sam pisałeś ten kod?

Kod zmodyfikowałem, i widzisz problem jest taki ze jak usuwam float left to Odnośnik tekstowy + ikonka/obrazek znika całkowicie z tabelki ogłoszenia

No a jak to ma wyglądać? Ten napis Ogłoszenie na czerwonym ma floatować do lewej a ten dolar to gdzie niby ma być?
Nic nie napisałeś co chcesz z tym zrobić.

Gdybym chciał aby coś się z tym działo to bym napisał wyżej stoi jak byk' ze wszystko działa tylko ikonka nie chce pojawiać się z prawej strony właśnie przez ten float - a Funkcja wygląd następująco - wysuwa się panel boczny tam mamy odnośniki tekstowe do Ogłoszeń na które klikamy i nas przenosi i tyle obok odnośnika tekstowego ma być ikonka np ten dollar - zauważyłem ze gdy usuwam <img src="images/ogloszenie.png" /> z divu w szablonie to wszystko działa

No do dodaj float tylko do pierwszego img

#ogloszenie img:first-child {
    float: left;  
}

---

Nie widzę kodu "na żywo" więc to utrudnia.

No do dodaj float tylko do pierwszego img

Super, działa + Leci, dziękuje bardzo za pomoc

Szybciej by poszło gdybyś napisał wprost że drugi obrazek ma nie floatować do lewej

Szybciej by poszło gdybyś napisał wprost że drugi obrazek ma nie floatować do lewej

Problem w tym ze jestem żółtodziobem i nawet nie wiem ze są takie funkcje jak float 'dziecko' tylko 4 litery zawracamy takimi pierdołami

No to czas poczytać trochę

Nie float'dziecko' tylko operacja na wybranym elemencie zawartym w czymś.