Page 1 of 1

Auto-zoom код?

Posted: Mon Feb 17, 2020 10:33 pm
by qnkov90
Някой има ли идея за някой зоом-код, който да работи добре към всички браузери?
Пробвах нещо такова, но все нещо не е наред с някой браузер?

Code: Select all

@media screen and (max-width: 1920px) {
  html {
    -moz-transform: scale(1.0, 1.0);
    zoom: 1.0;
    zoom: 100%;
  }
}
@media screen and (max-width: 1280px) {
  html {
    -moz-transform: scale(0.75, 0.75);
    zoom: 0.75;
    zoom: 75%;
  }
}
@media screen and (max-width: 800px) {
  html {
    -moz-transform: scale(0.50, 0.50);
    zoom: 0.50;
    zoom: 50%;
  }
}

Re: Auto-zoom код?

Posted: Wed Feb 19, 2020 9:08 am
by deam0n
Zoom и scale са малко по-различни едно от друго..

Защо искаш да го направиш така? Така не се прави responsive design!?

Почти съм сигурен, че на по-малки резолюции така няма да се чете нищо и сайта ще стане неизползваем.

По-добре виж какво е responsive grid
https://www.w3schools.com/css/css_rwd_grid.asp
и responsive typograpfy
https://blog.logrocket.com/the-elements ... typography
https://css-tricks.com/snippets/css/fluid-typography/

Re: Auto-zoom код?

Posted: Wed Feb 19, 2020 2:56 pm
by qnkov90
Точно заради това ще задам за всяка резолюция колко да зоомва, а при про-малка, ще си е на 100 процента. Проблема е, че винаги нещо се чупи като направя тоя зоом, но защо нямам проблем със зоома от самият браузер? Най-вероятно имам мешница в кода на темат, заради това и така се получават счупвания?

Да тръгна от сега да се уча как се прави респонсиве... Ако знаеш как се прави и можеш, дай ти дам 30-40 лева и да ми го респоснеш. :)

Re: Auto-zoom код?

Posted: Wed Feb 19, 2020 3:37 pm
by deam0n
Това със zoom-a е малко непредивидо като че ли..

То тоя твоя сайт според мен лично най-добре да си намериш някоя сходна по визия тема, която е responsive и да отделиш малко време и да я сложиш нея. Чиста работа. Тамън от 2008 ако не е сменян един ъпдейт няма да му дойде зле :)

Re: Auto-zoom код?

Posted: Wed Feb 19, 2020 3:43 pm
by dakata__92
И на мен не ми е на душата идеята със зуум. Да, решение е на проблема, но не е правилното такова. :naughty:

Re: Auto-zoom код?

Posted: Wed Feb 19, 2020 8:25 pm
by qnkov90
Ами, българско решение е. Ако успея да го направя без проблем в браузерите, няма да ми пука за респонсиве накрая.
Иначе ако тръгна да сменям темата, единственото решение е аниме тема, но пригодена за тая работа, с допълнителни плъгини и екстри, които са за проекти. Струва има няма 30-40 долара и трябва отначало да почна всичко, понеже там не е със страници, а специална база за анимета и куп щуротии - https://www.codester.com/items/14052/de ... ress-theme

Наистина не ми се занимава. Дайте мнения как да направиме нещата със зоома и да изчистиме грешките из различните браузери и всичко ще е ток. Като цяло на 110 процента искам да вдигна зоома, което ще е добре. ;)

Ето при хроме проблем - https://prnt.sc/r4szod
- Отдолу постоянно играе скролването за наляво-надясно.

Ето при firefox - https://prnt.sc/r4t12w
- Освен, че има същия проблем, при него и горе менюто се изяжда.

Предполагам това всичко се дължи на грешки и лош код в темата, а не в самият зоом код. Но нямам идея как да ги оправя, като че ли. :)

ЕДИТ:

@media screen and (max-width: 1920px) {
html {
-moz-transform: scale(1.1, 1.1);
-webkit-transform: scale(1.1, 1.1);
-ms-transform: scale(1.1, 1.1);
zoom: 1.1;
zoom: 110%;
}
}

В момента пробвах така, за да може при всички браузери да работи зоома, но така scale яде навсякъде горе сайта. А без скале, само със зоом, при интернет експлорера и мозила, не прави никакъв зоом, само при Хрома работи без скале.

@media screen and (max-width: 1920px) {
html {
-moz-transform: zoom(1.1, 1.1);
-webkit-transform: zoom(1.1, 1.1);
-ms-transform: zoom(1.1, 1.1);
zoom: 1.1;
zoom: 110%;
}
}

Ако го обърна пък така, само при Хрома си остава зумнато. Навсякъде другаде се връща обратно, както си е било.

@media screen and (max-width: 1920px) {
html {
transform: scale(1.2);
transform-origin: top
}
.zoom {
zoom: 120%;
}

А по този начин, при Мозила и Експлорера, не яде горе логото, но го прави при Хроме.
То това направо ме побърква вече. :)

Re: Auto-zoom код?

Posted: Wed Feb 19, 2020 11:32 pm
by Revelation
Никога няма да го нагодиш, защото предназначението на zoom никога не е било такова.

Хората са добавили media queries, за да можеш да нагаждаш дизайна си според резолюцията и по този начин да направиш сайта responsive(но не използвайки zoom/scale).

Ако толкова държиш да използваш твоя начин, направи няколко файла за всеки браузър, нагоди ги, направи си JS скрипт, който да идентифицира браузъра на потребителя и според това, динамично зареждай съответния CSS файл.

Re: Auto-zoom код?

Posted: Sun Feb 23, 2020 10:52 am
by qnkov90
За жалост, идея си нямам как да го направя това. Ако знаеш да ползва media queries, дай да си пишеме. :)))