Scroll Up как на vkontakte

[Skaiman]

Ссылка работает, это твой браузер не работает :) Шаблона нет, есть для CSS определенные свойства указывающие на каких устройствах что показывать и как

<xen:if is="@enableResponsive">
    @media (max-width:610px) {
        .in_top {
            display: none;
        }
    }
</xen:if>

Так будет для блока кнопки, только можно изменить разрешение с какого блок не будет видно

Добавить в конец кода для EXTRA.css

 

[Norisen]

Ссылка работает, это твой браузер не работает :-) Шаблона нет, есть для CSS определенные свойства указывающие на каких устройствах что показывать и как

<xen:if is="@enableResponsive">
    @media (max-width:610px) {
        .in_top {
            display: none;
        }
    }
</xen:if>

Так будет для блока кнопки, только можно изменить разрешение с какого блок не будет видно

Добавить в конец кода для EXTRA.css

Вставил в EXTRA.css - не работает

Код из всего EXTRA.css

.xenOverlay.memberCard.Admin {box-shadow: 0 0 65px 15px darkred;}
.xenOverlay.memberCard.Moder {box-shadow: 0 0 65px 15px darkgreen;}

/* Фикс ширины логоблока и модераторбара */

body .topHelper,
#header #logoBlock,
footer .bottomHelper {
background-color: transparent;
}

body #moderatorBar {
background-color: transparent;
border-bottom: none;
}

#moderatorBar .pageWidth {
background-color: rgb(45, 45, 45);
border-bottom: 1px solid rgb(88, 88, 88);
}

#logoBlock .pageWidth {
background-color: rgb(20, 20, 20);
}

.footerLegal .pageWidth {
background-color: rgb(34, 34, 34);
}

/* / Фикс ширины логоблока и модераторбара */

.BRMSContainer .brmsTabContent ol.brmsContentList li {
border-top: 0px !important;
}

.BRMSContainer .itemContent .itemDetailName {
padding-right: 3px;
}

.in_top{
position: fixed;
left: 0px;
top: 0px;
width: 75px;
height: 100%;
opacity: 0.5;
filter: alpha(opacity=50);
cursor: pointer;
display: none;
}
.in_top:hover{
background-color: rgb(25, 25, 25);
opacity: 1;
filter: alpha(opacity=100);
}
.in_top span{
display: block;
width: 75px;
margin-top: 300px;
text-align: center;
color: rgb(0, 255, 191);
font-weight: bolder;
}

#content{
width: 100%;
margin: 0 auto;
}

.prefix.razdacha {
color: #FF8F00;
text-shadow: 0 0 5px;
}
.prefix.razdacha:before {
color: #FF8F00;
text-shadow: 0 0 5px;
font-family: 'FontAwesome';
content: "\f0e7";
padding-right: 5px;
}

.node .nodeControls,.footerLinks a.globalFeed{display:none;}

<xen:if is="@enableResponsive">
@media (max-width:@maxResponsiveWideWidth)
{
.Responsive .messageUserBlock .userBanner.wrapped {
display: block;
max-width: 100%;
}
}
</xen:if>

#logoBlock #logo
{
float:none;
text-align:center;
}

<xen:if is="@enableResponsive">
@media (max-width:150px) {
.in_top {
display: none;
}
}
</xen:if>

 

[Mirovinger]

Работает, просто разрешение совсем маленькое указали, но могли и сами догадаться, что 150 можно до 480 увеличить.

 

[Norisen]

Работает, просто разрешение совсем маленькое указали, но могли и сами догадаться, что 150 можно до 480 увеличить.

Я уже все значения испытал, и маленькие и большие. И 480 - тоже. Но результат тот-же что довольно странно.

 

[Skaiman]

Явно что то не так сделал или не работает код в EXTRA.css, может комментируется где то, может еще что, но так уже не скажешь ни чего, только по месту смотреть надо.

Приоритет надо добавить

<xen:if is="@enableResponsive">
    @media (max-width:610px) {
        .in_top {
            display: none!important;
        }
    }
</xen:if>

Только что все проверил

 

[Norisen]

Явно что то не так сделал или не работает код в EXTRA.css, может комментируется где то, может еще что, но так уже не скажешь ни чего, только по месту смотреть надо.

Приоритет надо добавить

<xen:if is="@enableResponsive">
    @media (max-width:610px) {
        .in_top {
            display: none!important;
        }
    }
</xen:if>

Только что все проверил

Сейчас проверю

Явно что то не так сделал или не работает код в EXTRA.css, может комментируется где то, может еще что, но так уже не скажешь ни чего, только по месту смотреть надо.

Приоритет надо добавить

<xen:if is="@enableResponsive">
    @media (max-width:610px) {
        .in_top {
            display: none!important;
        }
    }
</xen:if>

Только что все проверил

Спасибо за то что проморочились со мной! Сработало. Прям камень с души

 

[grisha2217]

1. Лучше использовать .Responsive .in_top, чем !important
2. В настройках вашего стиля есть пункт "Адаптивный дизайн", используйте значения оттуда, а не вручную прописывайте 610px

 

[Skaiman]

grisha2217, так то значение было специально так дано, что бы ясно ему же было :) А .Responsive там не даст ни чего помоему.

В настройках вашего стиля есть пункт "Адаптивный дизайн", используйте значения оттуда, а не вручную прописывайте 610px

После твоих советов еще надо кучу пояснений делать :) Я и старался упростить

 

[grisha2217]

Skaiman,


Берешь любой селектор, хоть .pageContainer .titleBar h1, добавляешь в начало .Responsive и получаешь селектор, имеющий вес больше, чем предыдущий.

 

[Skaiman]

класс .Responsive, указывает на адаптивный дизайн, как и условие в моем коде, приоритет выше именно для адаптивного дизайна, important не портит ни чего :) Лан хватит это офтоп разводить.

Лучше использовать .Responsive .in_top, чем !important

Не лучше, проверил, не дает ни чего, потому что приоритет ява скрипта