Toon posts:

[HTML] Selectbox breder maken naar uitklappen

Pagina: 1

Acties:

288 views sinds 30-01-2008
Reageer

maandag 1 oktober 2001 16:54

Acties:

DeFeCt

je wéét toch

Topicstarter

Hi,

Topictitel zegt het eigenlijk al..

Is het mogelijk om een selectbox een vaste width mee te geven, maar op het moment dat je het uitklapt dat ie toch zo breed wordt dat ie het langste woord laat zien.

Ik hoop dat het een beetje duidelijk is, probeer anders eens een ander font te selecteren in WORD, dat is ongeveer de functionaliteit die ik zoek.

tnx in advance.

Flickr

maandag 1 oktober 2001 16:59

Acties:

Explore

Op zoek naar werk

In 1 woord: kennie.

In 24 woorden: De breedte van een (niet geselecteerde) selectiebox is altijd even breed als het langste woord/zin in de lijst. Dus dit is niet mogelijk.

[ specs ] [ Tweaker gallery ]

maandag 1 oktober 2001 17:09

Acties:

Pelle

🚴‍♂️

Ik vrees dat Explore gelijk heeft.
Dit doet ongeveer wat je wilt, maar is denk ik niet bevredigend genoeg.

't valt te proberen though:

code:

<html>
<head>
    <title>Melp</title>
    <style type="text/css">
    <!--
        #blah {
            width: 100px;
        }
    -->
    </style>    
</head>

<body>

<form>
    <select id="blah" 
        onFocus="this.style.width=300;" 
        onBlur="this.style.width=100;">
            <option>dfaskdfjaskdjfasl;kdjf;asldkfja;sldfja
            <option>bla
    </select>
</form>

</body>
</html>

maandag 1 oktober 2001 17:18

Acties:

Pelle

🚴‍♂️

Op maandag 01 oktober 2001 16:59 schreef Explore het volgende:
In 24 woorden: De breedte van een (niet geselecteerde) selectiebox is altijd even breed als het langste woord/zin in de lijst.

Das niet helemaal waar trouwens; je kunt met CSS de breedte van een <select> aanpassen. In dat geval kan het dus gebeuren (en dat is wat DeFeCt wil voorkomen) dat de tekst die erin staat te lang is en voor een gedeelte dus niet weergegeven wordt.

maandag 1 oktober 2001 17:35

Acties:

Explore

Op zoek naar werk

Op maandag 01 oktober 2001 17:18 schreef Pelle het volgende:

[..]

Das niet helemaal waar trouwens; je kunt met CSS de breedte van een <select> aanpassen. In dat geval kan het dus gebeuren (en dat is wat DeFeCt wil voorkomen) dat de tekst die erin staat te lang is en voor een gedeelte dus niet weergegeven wordt.

Je hebt gelijkt, heb het nog even nagekeken. Echt lekker werken doet 't niet, overigens. Leuke site heb je trouwens. Werk je freelance? ('k heb niet alles gelezen...)

[ specs ] [ Tweaker gallery ]

dinsdag 2 oktober 2001 10:13

Acties:

DeFeCt

je wéét toch

Topicstarter

Op maandag 01 oktober 2001 17:09 schreef Pelle het volgende:
Ik vrees dat Explore gelijk heeft.
Dit doet ongeveer wat je wilt, maar is denk ik niet bevredigend genoeg.

Het lijkt een goed begin, het resultaat is inderdaad niet bevredigend, ben al lang blij dat je begrijpt wat ik bedoel

Ben bang dat dit inderdaad niet mogelijk is

Flickr

dinsdag 2 oktober 2001 10:19

Acties:

Clay

cookie erbij?

Kan wel, maar het is kutwerk.

In IE kan je gewoon met css je box zo breed maken als je wil, maar voor ns kan dat niet zomaar, daarmee moet je de select in html leeg in je page zetten (zonder options dus) met in de select tag width="watjijwil" en die na de onload vullen met options, dat is toch nog wel redelijk generiek te scripten, dus op zich valt het mee. Ns is namelijk te dom om daarna de select alsnog een breedte te geven die overeenkomt met je items. (dat gepook kan je allemaal achterwege laten als je je niet om ns bekommert)

Hierna moet je nog een select maken en die gewoon van te voren vullen zodat ie zo breed wordt als nodig is. Die stop je in een layer, en die wordt visible als je op de eerste select klikt, en verdwijnt met de onblur ofzo.
Het enige wat je dan nog moet scripten is een synchronisatie van de selectedIndexen van de 2 selectboxen, en hoppa, je effect is gefaked.

Instagram | Flickr | "Let my music become battle cries" - Frédéric Chopin

dinsdag 2 oktober 2001 13:01

Acties:

DeFeCt

je wéét toch

Topicstarter

Klinkt als heel veel abracadabra in mijn oren Clay, maar toch bedankt.

Gelukkig hoeft het nu alleen nog maar in IE te werken , alleen zie ik dan nog niet helemaal hoe het in CSS gaat werken, misschien dat je mijn vraag verkeerd begrepen hebt, of dat ik gewoon dom ben. (wat opzich ook best aannemelijk klinkt)

Die width meegeven aan een selectbox is het probleem niet, maar wat als de width 100px is en als ie uitgeklapt 140px (of wat de content dan ook maar nodig heeft) moet zijn?

das mijn probleem

Flickr

dinsdag 11 december 2001 15:41

Acties:

Hangloozz

{ @$%&# }

even nieuw leven inblazen omdat ik het ook grag wil toepassen.
Ik vindt de gegeven CSS oplossing ranzig dus daar waag ik me niet aan.

Iemand dit ooit in dHTML geklust, soms?

www.jurgroessen.nl

dinsdag 11 december 2001 15:49

Acties:

Clay

cookie erbij?

Imho is het nogal een overdreven gehannes om een dhtml dropdown te fabriceren die daarnaast ook nog net zo makkelijk te integreren is in je form (inclusief multiselect) voor een effect wat op zich zo klein is.

Ik kan me wel degelijk voorstellen dat dit klapuit effect handig kan zijn in zekere designs waar je zo'n ding gewoon niet de ruimte kan geven die die zelf hebben wil, heb het zelf ook een keer moeten maken, maar ik denk niet dat je daardoor een bak dhtml kan rechtvaardigen als er veel simpelere oplossingen zijn. En dan krijg je ook nog eens dat zo'n dhtml er niet uitziet als een standaard form ding, en dat kan je klanten meestal maar moeilijk uitleggen

zo denk ik er iig over.

Instagram | Flickr | "Let my music become battle cries" - Frédéric Chopin

dinsdag 11 december 2001 16:12

Acties:

Pelle

🚴‍♂️

* Pelle denkt ook dat het een beetje zinloze feature is

Moet niet zo moeilijk te maken zijn in DHTML though.
Ontwerp een mooi dropdowntje, of gewoon een textlinkje, whatever. Erop klikken displayed een nieuwe layer, die de goeie breedte heeft en alle options die je select normaal zou hebben.
Bij het klikken op een 'option' wordt een hidden input op die pagina gevuld met een bepaalde waarde. Bij het klikken naast de layer verdwijnt de layer weer.

Het wordt wel lastig als je veeeeeel opties hebt en dus ook nog moet gaan scrollen in die layer. In IE zou je er dan weer gewoon een iframe in kunnen hangen, maar voor NS4 ben je dan weer overgeleverd aan dhtml-scrollbars...

dinsdag 11 december 2001 16:25

Acties:

Hangloozz

{ @$%&# }

pff, wat een saaie, stoffige webdevvers zijn jullie toch ook he

Maar tis in dit geval omdat de layout het niet zo goed toelaat om een lange tekst kwijt te kunnen, en dan praat ik over dingen als:

-Woningbouw met zorgvoorzieningen voor ouderen
-Gebouwen voor handel, winkelcentra en industrie

Dat is al bijna schermbreedte.

Op zich is de methode die Pelle aanhaalt met die layertjes zo gek nog nie...

www.jurgroessen.nl

dinsdag 11 december 2001 16:26

Acties:

oh,when?

...

* oh,when? gaat dan nog ff roet in het eten gooien

"Hoe weet je hoe breed het langste woord is in de dropdown"

Tel je het aantal characters, fake je het dmv een array met alle characters en de breedte daarvan, hoe behandel je het verschil tussen weergave in verschillende browsers/operating systems.

Dus het probleem lijkt me niet om de dropdown breedte aan te passen, maar om het even breed te maken als het langste woord in de dropdown lijst zelf.

"You're only as good, as what you did last week."

dinsdag 11 december 2001 16:28

Acties:

Pelle

🚴‍♂️

Op dinsdag 11 december 2001 16:26 schreef oh,when? het volgende:
* oh,when? gaat dan nog ff roet in het eten gooien
Dus het probleem lijkt me niet om de dropdown breedte aan te passen, maar om het even breed te maken als het langste woord in de dropdown lijst zelf.

Euhm... nee.
Je kunt toch gewoon een layer definieren, die je geen width meegeeft? Daarin pleur je een <table>, met op elke row een option.
Dit geeft je 2 mogelijkheden: een option kan verspreid worden over meerdere regels, of je gooit overal 's tussen zodat de tabel zo groot wordt als de langste option, en de layer zelf dus ook aangezien die gewoon meeschaalt.

dinsdag 11 december 2001 16:31

Acties:

Pelle

🚴‍♂️

Oh en Clay: het is natuurlijk niet zo moeilijk om die 'dropdown' die je bouwt op een echte dropdown te laten lijken.. dus het probleem van het er anders uitzien, gaat ook nie op denk ik.

dinsdag 11 december 2001 16:31

Acties:

oh,when?

...

Op dinsdag 11 december 2001 16:28 schreef Pelle het volgende:

[..]

Euhm... nee.
Je kunt toch gewoon een layer definieren, die je geen width meegeeft? Daarin pleur je een <table>, met op elke row een option.
Dit geeft je 2 mogelijkheden: een option kan verspreid worden over meerdere regels, of je gooit overal 's tussen zodat de tabel zo groot wordt als de langste option, en de layer zelf dus ook aangezien die gewoon meeschaalt.

hey ik had jouw reply nog helemaal niet gelezen

Optie klinkt leuk, echter denk dat het wel lastig word om het helemaak pixelperfect werkend te krijgen. En renderen niet altijd even breed.

"You're only as good, as what you did last week."

dinsdag 11 december 2001 16:37

Acties:

Pelle

🚴‍♂️

Op dinsdag 11 december 2001 16:31 schreef oh,when? het volgende:
hey ik had jouw reply nog helemaal niet gelezen

Foei!

Optie klinkt leuk, echter denk dat het wel lastig word om het helemaak pixelperfect werkend te krijgen.

Hoezo? Je kunt natuurlijk gewoon ook de muiscursor uitlezen en aan de hand daarvan je layer positioneren.

En renderen niet altijd even breed.

Dat maakt toch niet uit? Ik bedoel dit zegmaar:

code:

1	Woningbouw met zorgvoorzieningen voor ouderen

De tabel wordt nu even groot als deze option aangezien de tekst niet wordt afgebroken nu.

dinsdag 11 december 2001 16:41

Acties:

Verwijderd

vergeef me als ik nu iets heel doms zeg, maar kun je niet gewoon de font-size wat kleiner maken en dan de width instellen zodat alles mooi past enzo ?

Pagina: 1

Reageer