Nieskalowalny obrazek na całą szerokość

pytanie zadane 30 sierpnia 2018 w HTML i CSS przez niezalogowany

Witam jak zrobić responsywny obrazek na całą szerokość zależny od diva w którym się znajduje aby nieskalował się podczas zmiany rozmiaru strony za pomocą CTRL+Scroll down ?

2 odpowiedzi

odpowiedź 30 sierpnia 2018 przez Tomek Sochacki Ekspert (227,510 p.)

Tu masz przykład jak z poziomu JS zablokować możliwość zoomowania okna:

https://codepen.io/VijayDhanvai/pen/QdLJae

Możesz w tym miejscu wykonać jakieś swoje akcje, np. odpowiednio modyfikować rozmiary obrazka itp.

Ale generalnie NIE POLECAM takiego rozwiązania. Jeśli użytkownik samodzielnie zwiększa/zmniejsza rozmiar to robi to z jakiegoś konkretnego powodu, może nie widzi i chce coś powiększyć itp. Nie blokuj tego, szczerze to nie widzę żadnego sensownego uzasadnienia dla ingerowania w takie zachowanie użytkownika.

komentarz 30 sierpnia 2018 przez niezalogowany

Nie no te pop-upy to przypał jest :) Mi chodziło żeby IMG było nieskalowalne a nie żeby blokować akcje myszki :D

komentarz 30 sierpnia 2018 przez Tomek Sochacki Ekspert (227,510 p.)

aby nieskalował się podczas zmiany rozmiaru strony za pomocą CTRL+Scroll down

chwila, sam piszesz, że chcesz trzymać rozmiar na akcji zoomowania, to w końcu co Ty chcesz zrobić?

W tym codepenie jest akurat alert ale dałem go, aby Ci pokazać jakiś sposób na przechwycenie zoomowania usera, a co z tym zrobisz to już od Ciebie zależy, tam autor akurat robi alert, Ty możesz odpowiednio ustawić wymiary obrazka.

komentarz 30 sierpnia 2018 przez Tomek Sochacki Ekspert (227,510 p.)

Możesz dać wymiary obrazka w procentach, ale one będą liczone względem rodzica także jeśli np. dasz ograniczenie max-width dla body to i tak zostaną policzone max dla tej szerokości bidy.

komentarz 30 sierpnia 2018 przez niezalogowany

No tak racja, dzięki :)

odpowiedź 30 sierpnia 2018 przez Eliro Stary wyjadacz (12,160 p.)

Ustaw mu rozmiary w pikselach, a nie w procentach.

komentarz 30 sierpnia 2018 przez Tomek Sochacki Ekspert (227,510 p.)

https://codepen.io/anon/pen/xaRjQj

To i tak możesz zmniejszać poprzez CTRL+Scroll down, a autorowi chodzi o zablokowanie tego całkowicie.

komentarz 30 sierpnia 2018 przez niezalogowany

A nie można ustawić max i min height tak żeby się zmniejszało do pewnego stopnia a dalej już nie ? No wiesz pewnie jak to wygląda na tych ładnych stronkach :)