• 8 odgovora
  • 2.933 pregleda
Problem sa horizontalnim scrollbarom 27.06.2011. u 15:44 · pre 186 meseci #1
Zdravo svima,

imam problem sa definisanjem strukture stranice. Malo je komplikovano, pa sam zakacio sliku da bi bilo jasnije.



Zahtev je sledeci:
- scrollbar sme da se pojavi samo kada je sirina stranice manja od 960px (odnosno kada je viewport manji od sirine sadrzaja)
- baneri sa strane moraju da budu 'klikabilni'
- u headeru i footeru se nalazi grafika koja se pruza 'celom' sirinom (od 1200px)
- ljubicasti i sivi pravouganik takodje imaju sadrzaj (koji nije siri od 960px)

Pokusao sam ovo da resim na vise nacina, uz par nesporazuma (u pocetku nigde nije bilo naznaceno da strana treba ovako da se ponasa), ali nisam uspeo.

Bio bih veoma zahvalan ako neko ima predlog u kom pravcu da potrazim resenje.

Hvala unapred.
Potpis
We have no Great War. No Great Depression.
Our great war is a spiritual war. Our great depression is our lives.
Re: Problem sa horizontalnim scrollbarom 28.06.2011. u 08:18 · pre 186 meseci #3
Fiksiran.

Jedno od resenja, kome cu mozda pribeci, jeste da postavim

Code:

body{
overflow-x: hidden;
}


cime bih ukinuo scroll potpuno.

Drugo resenje, koje bih u kranjem slucaju primenio, jeste da pomocu javascripta ispitam veclicinu prozora prilikom ucitavanja stranice i svakog resizea i u zavisnosti od toga togglejem overflow-x: hidden;.
Potpis
We have no Great War. No Great Depression.
Our great war is a spiritual war. Our great depression is our lives.
Re: Problem sa horizontalnim scrollbarom 28.06.2011. u 08:51 · pre 186 meseci #4
Code:

html {overflow:scroll;}



ovo ih pokazuje stalno, sto je mnogo bolje



a kao sto vidis po slici, i nije ti pametno da pravis sire sajtove od 980px, zato sto ce se lose prikazati svakom 3 posetiocu...

Re: Problem sa horizontalnim scrollbarom 28.06.2011. u 09:14 · pre 186 meseci #5
znam za to, stalno ih i pravim u 980px, ipak hvala na sugestiji :)

jednostavno to je eksplicitan zahtev poslodavca (zbog toga je i bilo nesporazuma), sirina da bude 1220px i da nema scrolla za ekran >= 1024px sirine.

za sada sam resio to na sledeci nacin:

Code:

$(document).ready(function() {

 if( $(window).width() < 980 )
     $(document.body).css('overflow-x', 'visible');
             
 $(window).resize(function() {
     if( $(window).width() < 980 )
     $(document.body).css('overflow-x', 'visible');
 });
            
});



Potpis
We have no Great War. No Great Depression.
Our great war is a spiritual war. Our great depression is our lives.
Re: Problem sa horizontalnim scrollbarom 28.06.2011. u 12:20 · pre 186 meseci #6
Možeš da probaš i sa CSS3 Media Queries kod modernijih browser-a, nešto kao:
Code:

@media screen and (min-width: 960px) and (max-width: 1220px) {
  body {
    overflow-x: hidden;
  }
}

Potpis
Banned - Not available
Re: Problem sa horizontalnim scrollbarom 28.06.2011. u 12:44 · pre 186 meseci #7
onda bih morao da radim browser proveru?
Potpis
We have no Great War. No Great Depression.
Our great war is a spiritual war. Our great depression is our lives.
Re: Problem sa horizontalnim scrollbarom 30.06.2011. u 21:52 · pre 186 meseci #8
Nestigoh ranije da ti odgovorim.. Elem, ukoliko su ti margine u kombinaciji sa relativnim pozicioniranjem prihvatljive mogao bi nesto tako da uradis na ovaj nacin (view source). Istina, ovaj pristup ima mana i komplikuje i markup i css dodatno ali je po meni ipak bolje od js resenja (jer nemaju svi js).

sto se banera tice oni bi trebali bolje da se odrade, ja sam samo naveo najprostiji primer.
Potpis
rafforum.rs - Forum Računarskog Fakulteta
Re: Problem sa horizontalnim scrollbarom 04.07.2011. u 09:00 · pre 186 meseci #9
hvala :)

nesto slicno (sa negativnim marginama) sam uradio i dobio sam uzasan markup.

pokusacu da primenim tvoje resenje, bar da js izbacim.

hvala jos jednom.
Potpis
We have no Great War. No Great Depression.
Our great war is a spiritual war. Our great depression is our lives.
Prijavite se da biste odgovorili u ovoj temi.PrijavaRegistracija

Premeštanje teme