/ Forside/ Teknologi / Internet / Hjemme sider / Spørgsmål
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
Hjemme sider
#NavnPoint
molokyle 23766
Klaudi 7947
bentjuul 7763
BjarneD 4584
severino 4460
Manse9933 4366
natmaden 3985
disken 3947
miritdk 3593
10  refi 3578
Stoppe horizontal scrollbar
Fra : kathy
Vist : 1520 gange
100 point
Dato : 24-07-07 13:48

Er der nogen, der kan huske den?
Når den horizontale scrollbar vises unødigt, er der en stump kode, der kan stoppe den.
Har set den før - her på siden - men fik den ikke gemt.
Sandsyndligvis et guldkorn fra MOLOKYLE.

mvh
kathy

 
 
Kommentar
Fra : vith


Dato : 24-07-07 15:18

På min hjemmeside (lavet i Front page Express) skriver jeg: scroll="auto""
så kommer scrollbaren kun på, hvis det er nødvendigt.

Kommentar
Fra : kathy


Dato : 24-07-07 15:27

Hej with
hverken "auto" eller "default" virker altid.
Det er simpelthen en stump kode, der sættes ind i headafsnittet i de tilfælde, hvor scrollbaren ikke er til at styre på anden vis.

mvh
kathy



Kommentar
Fra : vith


Dato : 24-07-07 15:31

Okay, den kode kender jeg desværre ikke.
mvh vith

Kommentar
Fra : kathy


Dato : 24-07-07 15:33

Tak alligevel
mvh
kathy

Accepteret svar
Fra : molokyle

Modtaget 100 point
Dato : 24-07-07 17:17

Er det max-width og min-width egenskaberne du tænker på?

http://www.w3schools.com/css/pr_dim_max-width.asp

http://www.w3schools.com/css/pr_dim_min-width.asp

Det er standard CSS 2, men virker IKKE i IE 6
...alle andre nyere browsere IE 7 inklusive, forstår imidlertid godt disse egenskaber.

Jeg benytter dem selv på min hjemmeside: http://www.cssboxing.com/

..eksempelvis i den overordnede indholdsdel:
Kode
#page
{
display:block;
max-width:792px;
min-width:440px;
margin-left:216px;
margin-right:16px;
clear:left;
}


Dvs. at den horizontale scrollbar først vises, hvis vinduets størrelse eller skærmopløsningen er mindre end 800 pixels (= 800 X 600 vindue/skærmopløsning i bredden - (minus) browser 'ting', som vinduesramme og vertical scrollbar.)

Atlså; viewporten er 440 pixel + de 184 pixels som menuen i fast bredde fylder = 624 pixels + marginer + browser 'ting'.

Det er og bli'r et større regnearbejde i pixels

For en max-width på 792 pixels vedkommende?
..så er det for, at siden ikke strækker sig længere end til en viewport på 1024 X 768 pixels (..af læsbarhedshensyn i større skærmopløsninger), men derefter så til gengæld centreres ved større opløsninger

Et andet 'trick' er at sætte marginer og padding for alle HTML elementer på siden som 0px:
Kode
* {margin:0px;padding:0px;}


..samt at sætte body til 100% størrelse i bredde og højde:
Kode
body {width:100%;height:100%;}


Selvom jeg forbeholder mig ophavsret til mine sider (Det gælder det overordnede layout), så skal du være mere end velkommen til at aflure div. 'snippets' i min CSS

Kast et blik på f.eks. : http://www.cssboxing.com/css/black_layout.css

</MOLOKYLE>

Kommentar
Fra : molokyle


Dato : 24-07-07 17:26

Alene dette bør kunne gøre det :
Kode
* { margin:0;padding:0;}

body
{
height:100%;
width:100%;
margin:auto;
overflow:auto;
}


Hvis sidens bredde er større end indholdets bredde.

Laver du et (X-)HTML element ..eksempelvis en DIV med en fast bredde ud over vindue/opløsnings størrelsen?

Så får du naturligvis en horizontal scrollbar.

..ellers kig på overflow egenskaben: http://www.w3schools.com/css/pr_pos_overflow.asp

</MOLOKYLE>

Kommentar
Fra : molokyle


Dato : 24-07-07 17:34

vith -> scroll="auto" parameteren i HTML ..for <body..> .. </body> elementet er IKKE en standard attribut, men en Microsoft 'ting', som ikke følger standarden, som anbefalet af htttp:/www.w3.org/

..så tror pokker, at det ikke altid virker

I 'gamle' IE 6 dage brugte man i CSS:
Kode
html {
overflow: auto;
}


..for at fjerne uønskede scrollbars i IE ...det er muligt det et dette du tænker på kathy?

Dét har jeg nemlig skrevet om tidligere hér på boardet

</MOLOKYLE>

Kommentar
Fra : molokyle


Dato : 24-07-07 17:44

Ps. Prøv evt. at indsætte flg. i dit stylesheet :
Kode
* {margin:0;padding:0;overflow:auto;}


Gælder så ALLE elementer på siden (span/div/p/iframes mm.)

Mere sikkert er at bruge:
Kode
body {margin:0;padding:0;overflow:auto;}


..eller hvis du er SIKKER på, at indholdet ikke fylder mere end brugerens opløsning giver plads til:
Kode
html {margin:0;padding:0;overflow:hidden;}


</MOLOKYLE>

Kommentar
Fra : kathy


Dato : 25-07-07 08:30

God morgen MOLOKYLE
Tusind tak, det var lige det, jeg ikke kunne huske.
Tak for invitationen.
Vender tilbage

med venlig hilsen

Kathy

Godkendelse af svar
Fra : kathy


Dato : 26-07-07 14:22

Tak for svaret molokyle.
Var inde at kigge - Så er der noget at tage fat på.
boxing bliver helt klart mit næste 'skole' projekt.
har selv villet bruge <meta http-equiv="Page-Enter" content="blendTrans(Duration=2.0)">
Men da jeg kun ved hvordan, den skal anvendes til IE, overvejer jeg at gå fra den igen.
Er det overhovedet muligt, at få den til at virke cross browser?

Helt eksakt var mit problem at når jeg testede en side (i IE), der ikke overskred rammerne, udløste den en horizontal scrollbar, men ikke når jeg testede samme side ved en lavere skærm opløsning.
Det er jo fuldstændig ulogisk.
mvh
kathy



Kommentar
Fra : molokyle


Dato : 26-07-07 16:22

Omtalte META er en Microsoft proprietær egenskab, som KUN forstås af Miccosoft egne produkter:

IE, Frontpage, Powerpoint osv.

Det 'findes' ikke til andre browsere. Derfor 'filtrerer' jeg på min hjemmeside denne META fra, for andre browsere end IE ..med følgende konstruktion:
Kode
<!--[if IE]>
<meta http-equiv="page-exit" content="blendtrans(duration=3)" />
<![endif]-->


Andre standard browsere 'tror' nemlig det er en alm. kommentar
Kode
<!--
KOMMENTAR
-->


, men IE tolker den som en betingelse og læse hvad som står mellem kommentaren:
Kode
[if IE]>
<meta http-equiv="page-exit" content="blendtrans(duration=3)" />
<![endif]


Læs mere her: http://msdn2.microsoft.com/en-us/library/ms537512.aspx

På samme måde sørger jeg for, at diverse stylesheets retter sig mod relevante browsere, dels ved at lave specifikke 'overrides'/'overloading' af CSS egenskaberne ved, at benytte mig af precedensreglerne, delv vha. betingede kommentarer:
Kode
<link rel="stylesheet" type="text/css" media="all" href="/css/black_layout.css" />
.
<!--[if IE]>
<meta http-equiv="page-exit" content="blendtrans(duration=3)" />
<![if lte IE 6]>
<link rel="stylesheet" type="text/css" media="all" href="/css/ie6.css" />
<![endif]>
<![if gt IE 6]>
<link rel="stylesheet" type="text/css" media="all" href="/css/ie7.css" />
<![endif]>
<![endif]-->


Derved undgår jeg browsersniffing i Javascript og DOM

</MOLOKYLE>

Kommentar
Fra : kathy


Dato : 26-07-07 16:49

Tak for ekstra oplysninger.
Jeg så godt, at du havde lagt den ind specifikt til IE.
Det troede jeg ikke var nødvendigt. Ser på link i aften.
Hvad er browsersniffing - det lyder ikke specielt positivt?
mvh
kathy

Kommentar
Fra : molokyle


Dato : 26-07-07 19:09

For det første har jeg lagt en privat kommentar til dig kathy, men det var blot for at gøre dig opmærksom på, at jeg havde svaret dig her i tråden efter du lukkede spørgsmålet.

..denne private debat afslutter jeg lige ..sådan

For det andet; browsersniffing er, når man med en eller anden 'teknik' (..der findes flere metoder) på 'forhånd' afgør hvilken kode klienten skal 'se', ved hjælp af javascript og DOM. For at finde ud af hvilken browser der benyttes til at se siden kigger man på enten DOM BrowserDetect objektet eller ved at teste om visse browserspecifikke funktioner findes eller ej.

ad 1) http://www.quirksmode.org/js/detect.html (BrowserDetect)
ad 2) http://jennifermadden.com/javascript/dhtml/browserSnif.html (Document.all vs. Document.layers)

En anden tilgangsvinkel er, at benytte browser hacks som gør, at nogen browsere kan forstå den ene del af koden, medens nogen kan forstå den anden. Og så er der betingede kommentarer (Det er den sidste metode jeg selv benytter, men ingen af dem forliger sig på Javascript, men på hvad den specifikke browser rent faktisk kan rendere.)

Til dette findes der også flere metoder:

1.) CSS browser hacks ( Her er et link: http://www.positioniseverything.net/ )
2.) Betingede kommentarer (= 'min' metode)

Der raser store diskussioner om man skal benytte browser sniffing/-detection eller hacks/'udmaskning'. Det kan du sikker finde mere om på nettet

Det er bestemt IKKE blevet nemmere at være websmed

Happy coding... </MOLOKYLE>

Du har følgende muligheder
Eftersom du ikke er logget ind i systemet, kan du ikke skrive et indlæg til dette spørgsmål.

Hvis du ikke allerede er registreret, kan du gratis blive medlem, ved at trykke på "Bliv medlem" ude i menuen.
Søg
Reklame
Statistik
Spørgsmål : 177549
Tips : 31968
Nyheder : 719565
Indlæg : 6408820
Brugere : 218887

Månedens bedste
Årets bedste
Sidste års bedste