small scroll-up on mobile

Posted in: Newspaper
Post count: 64

Hello i need to display on mobile a scroll-up toggle i try to use this css code on mobile, but i want reduce the size from 40×40 to 25×25, how i make this?

.td-scroll-up {
display: block;
}

Post count: 35449

Hi,

IN order to achieve that please add the below custom code in Newspaper>Theme panel>Custom code>Custom css
@media (max-width: 767px){
.td-scroll-up {
display: block;
width: 25px;
height: 25px;
}
.td-scroll-up .td-icon-menu-up {
font-size: 15px;
width: 25px;
top: 3px;
}
}

Thank you.

Post count: 64

Thank you, i can also hide it on a home page or on an other specific page?

Post count: 35449

Hi,

Here is the custom css for homepage
.home .td-scroll-up{
display:none;
}

If you want to hide form all devices place the css outside of @media (max-width: 767px){ } , if you want to be hide only for mobile set it inside the {}

Thank you.

Post count: 64

thanks, i have another question:
On the “advance custom css” theme settings, there are 4 section :

PHONES -> 0 – 767px
IPAD PORTRAIT -> 768px – 1018px
IPAD LANDSCAPE -> 1019px – 1140px
DESKTOP -> 1141px +

What are the corresponding css codes to modify these sections?

Post count: 35449

Hi,

This section is made to let you to set different css on that devices, for example you can set this css in phones section
.home .td-scroll-up{
display:none;
}

and will be apply only on mobile
or in custom code>custom css you need to set this @media (max-width: 767px){ } in order to be apply only on mobile.

Thank you for your understanding.

Post count: 64

What are the css codes (@media…) for horizontal tablet, vertical tablet and desktop?

Post count: 35449

Hi,

PHONES 0 – 767px
-> @media (max-width: 767px){ }

IPAD PORTRAIT 768px – 1018px
-> @media (max-width: 1018px){ }

IPAD LANDSCAPE 1019px – 1140px
-> @media (max-width: 1140px){ }
DESKTOP 1141px +
-> @media (max-width: 1141px){ }

Thanks.

Viewing 8 posts - 1 through 8 (of 8 total)
The forum ‘Newspaper’ is closed to new topics and replies.