Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Выезжающая панель (https://javascript.ru/forum/dom-window/24331-vyezzhayushhaya-panel.html)

Александр х@к 26.12.2011 15:10

Выезжающая панель
 
Здраствуйте,

Срипт с фреймом, что с угла выезжает.
<div id="feedbackP">
    <div id="feedbackButton">
        Feedback
    </div>
    <iframe id="feedBackIframe" src="feedback.php"  scrolling="no" frameborder = "yes">
    </iframe>
</div>

ЦСС
#feedbackP{
    width : 400px;
    height : 272px;
    position : fixed; /* фиксируем позицию в окне */
    z-index : 50;
    /* сдвигаем панель вправо вниз: */
    top : 100%; 
    left : 100%;
    /* выдвигаем краешек: */	
    margin-top : -25px;
    margin-left : -130px;

    border : 2px solid;
    border-radius: 10px;
    
    padding: 5px;
    
    /*задаем эффект движения: */
    -moz-transition:margin 0.3s linear;	
    -o-transition:margin 0.3s linear;	
    -webkit-transition:margin 0.3s linear;	
    -ms-transition:margin 0.3s linear;	
    transition:margin 0.3s linear;	
}
#feedbackP:hover{	 
    /* выдвигаем панель на всеобщее обозрение: */	
    margin-top : -272px;
    margin-left : -400px;
    /*задаем эффект движения: */	
    -moz-transition:margin 0.3s linear;	
    -o-transition:margin 0.3s linear;	
    -webkit-transition:margin 0.3s linear;	
    -ms-transition:margin 0.3s linear;	
    transition:margin 0.3s linear;	
}

/*Делаем заголовок панели, как уголок папки с бумагами: */
#feedbackButton{
    font-weight : bold;
    margin-left : 10px;
    margin-top : -6px;
    border : 1px solid #717277;
    border-radius : 0px 0px 10px 10px;
    text-align : center;
    width : 100px;
    margin-bottom : 5px;
    color : #FFFFFF;
    background : #717277;
}

#feedBackIframe{
    width : 390px;
    height : 240px;
    border : 1px solid;
}

Кроссбраузерность:

* FF — да
* Chrome — да
* Safari — да
* Opera — панель всплывает не плавно, а рывком
* IE — молчу.
Но кроссбраузность у ФФ только новых(у мя 6 версия), взял 3-ью и...
всплывает не плавно, а рывком и даже не скругленные уголки.
Так вот как скрипт для старых версий ФФ довести до ума?

Kolyaj 26.12.2011 15:19

Firefox 3, очевидно, не поддерживает ни border-radius, ни transition.

nerv_ 26.12.2011 15:44

Цитата:

Сообщение от Александр х@к
Так вот как скрипт для старых версий ФФ довести до ума?

Ознакомиться с документацией тех версий FF, кот. Вас интересуют или установить их и тестить.

Александр х@к 26.12.2011 15:46

ну это ясно но у него есть замена бордеру(видел на сайте хтмлбук, сейчас найти не могу),а вот на счет transition: http://habrahabr.ru/blogs/css/111658/.Поддерживает с 4 версии, для ранних ни как?

Kolyaj 26.12.2011 15:47

Лицемерие какое-то. Про IE мы, значит, молчим, а древние версии Firefox хотим поддержать.


Часовой пояс GMT +3, время: 00:33.