DIG Digital Corner
Alles wat je altijd al over computers, hardware, software, internet en elektronische gadgets had willen weten, maar niet op Tweakers.net durft te vragen.
Ik open zelf maar even een nieuwe. Echt alleen javascript? Da's kut, dan moet ik echt een nieuwe pagina aanmaken voor hetzelfde artikel. Bedankt voor het opzoeken though 
Op
Een nieuwe pagina? Waarom?quote:Op donderdag 23 juni 2011 11:20 schreef RenRen- het volgende:
Ik open zelf maar even een nieuwe. Echt alleen javascript? Da's kut, dan moet ik echt een nieuwe pagina aanmaken voor hetzelfde artikel. Bedankt voor het opzoeken though
Ik zit te werken in Joomla..quote:
En echt niet omdat ik het zo fijn vind werken, het moet.
En daar heb je in een artikel de optie "Lees meer", alleen als ik dat selecteer, krijg je alleen de tekst VANAF de lees meer, dus niet de intro, en moet ik een andere optie gaan zoeken. En aangezien ik lastig in de html kan gaan kutten omdat de hele layout dan dood gaat, en javascript nog weleens opgeslokt wordt door Joomla, hoopte ik op een manier met CSS. Maar nu moet ik dus de introtekst op pagina 1, en de gehele tekst op pagina 2.
!
Dat lijstje met topics in de OP, dat kan er wel uit. En de TT, zullen we daar een keer [HTML/CSS] van maken?
Die moet je denk ik even in de FB posten, linkjes haal ik er wel uitquote:Op donderdag 23 juni 2011 11:43 schreef KomtTijd... het volgende:
Dat lijstje met topics in de OP, dat kan er wel uit. En de TT, zullen we daar een keer [HTML/CSS] van maken?
(Gewoon omdat het niet mijn subforum is)
is er een mogelijkheid om letters een willekeurige kleur te geven
en dan ook elke letter een andere kleur?
of laten kiezen uit bepaalde kleuren?
en dan ook elke letter een andere kleur?
of laten kiezen uit bepaalde kleuren?
Kun je 'm niet vinden?quote:
is er een mogelijkheid om letters een willekeurige kleur te geven
en dan ook elke letter een andere kleur?
of laten kiezen uit bepaalde kleuren?
[Javascript] voor dummies (deel 11)
nee nee...dat is geluktquote:
[..]
Kun je 'm niet vinden?
[Javascript] voor dummies (deel 11)
dit is toch iets anders
ik wil nu graag in 1 vd 2 css files dat de LETTERS een random kleur krijgen
elke letter een andere kleur ook nog
de vraag is of dat automatisch kan met een code in css...of toch js misschien
het is maar voor 12 woorden (menu) maar toch...tis een klote werk en als het auto kan
Nee, dat moet je scripten.
Of je moet iedere letter in een eigen span met classname zetten en iedere class een aparte kleur geven in je css. Maar dan nog zijn de kleuren dus niet random.
Of je moet iedere letter in een eigen span met classname zetten en iedere class een aparte kleur geven in je css. Maar dan nog zijn de kleuren dus niet random.
Als het toch maar twaaf woorden zijn zou ik het gewoon allemaal aparte span's geven. En kleuren zou je toch wel kunnen randomizen op een bepaalde manier? Ik zou het sowieso al niet doen overigens 
. Maar als je het voor die ene keer gaat string replace of een functie gaat schrijven dan kost het alleen maar denkkracht, voor die paar tekentjes extra.
. Maar als je het voor die ene keer gaat string replace of een functie gaat schrijven dan kost het alleen maar denkkracht, voor die paar tekentjes extra.
twaalf woorden zijn al snel een letter of 100.
100x <span class='color1'>a</span>, je moet het maar in je code willen hebben...
100x <span class='color1'>a</span>, je moet het maar in je code willen hebben...
Lettering.js doet dat automagisch voor je, om iedere letter een class zetten. Uiteraard ga je dat niet handmatig of in serverside-code zitten doen. Met wat CSS3 kun je zo heel makkelijk een kleurencombinatie maken die er random uit ziet.quote:
Nee, dat moet je scripten.
Of je moet iedere letter in een eigen span met classname zetten en iedere class een aparte kleur geven in je css. Maar dan nog zijn de kleuren dus niet random.
Nee.
Dat zeg ikquote:
[..]
Lettering.js doet dat automagisch voor je, om iedere letter een class zetten. Uiteraard ga je dat niet handmatig of in serverside-code zitten doen. Met wat CSS3 kun je zo heel makkelijk een kleurencombinatie maken die er random uit ziet.
Ja, maar een linkje naar een kant-en-klaar tooltje is wel zo handig toch? Ik zou in ieder geval waarschijnlijk een paar uur bezig zijn om zoiets zelf te scripten hoor 
- Maar ik ben dan ook geen Javascript-held.
- Maar ik ben dan ook geen Javascript-held.
Nee.
Vandaag trouwens bezig geweest met het positioneren van elementen die buiten de viewport kunnen vallen, indien deze te klein is. Het gaat om afbeeldingen die buiten de algemene container van de website staan, maar dus niet voor een horizontale scrollbar mogen zorgen. Nog een heel teringwerk geweest om iets te bedenken dat goed werkt, maar denk dat ik inmiddels een heel eind ben.
In eerste instantie dacht ik "absoluut positioneren, klaarrrrrr" - maar dat werkt natuurlijk alleen als de afbeeldingen naan de linkerkant buiten de viewport staan. Aan de rechterkant zorgt dit (logisch) natuurlijk voor een scrollbalk.
Voordat iemand zegt "media-queries!" - dat is m.i. geen mogelijkheid omdat het ook zonder Javascript moet werken in oudere browsers. Hopelijk morgen afronden
In eerste instantie dacht ik "absoluut positioneren, klaarrrrrr" - maar dat werkt natuurlijk alleen als de afbeeldingen naan de linkerkant buiten de viewport staan. Aan de rechterkant zorgt dit (logisch) natuurlijk voor een scrollbalk.
Voordat iemand zegt "media-queries!" - dat is m.i. geen mogelijkheid omdat het ook zonder Javascript moet werken in oudere browsers. Hopelijk morgen afronden
Nee.
ziet er goed uitquote:
[..]
Lettering.js doet dat automagisch voor je, om iedere letter een class zetten. Uiteraard ga je dat niet handmatig of in serverside-code zitten doen. Met wat CSS3 kun je zo heel makkelijk een kleurencombinatie maken die er random uit ziet.
weet alleen helemaal niet hoe dat jQuery werkt
wat ik dan weer minder vindt is dat de volgorde van de kleuren overal gelijk zijn
misschien is dat wel aan te passen maar ik zie niet hoe
Kijk naar het voorbeeld en de CSS die in de HTML zit:quote:
[..]
ziet er goed uit
weet alleen helemaal niet hoe dat jQuery werkt
wat ik dan weer minder vindt is dat de volgorde van de kleuren overal gelijk zijn
misschien is dat wel aan te passen maar ik zie niet hoe
| 1 2 3 4 5 6 7 8 9 10 | #demo2 .word2, .line2 { color: orange; } .char3, .word3, .line3 { color: yellow; } .char4, .line4 { color: blue; } .char5 { color: green; } .char6 { color: indigo; } .char7 { color: violet; } |
Als je het voor een woord van 100 letters doet is het wel veel werk maar het is dus te manipuleren.
jQuery instap;
http://docs.jquery.com/Tutorials:How_jQuery_Works
maar dan kan ik net zo goed alle letters apart een span class meegevenquote:Op vrijdag 24 juni 2011 12:04 schreef DaFan het volgende:
[..]
Kijk naar het voorbeeld en de CSS die in de HTML zit:
[ code verwijderd ]
Je kan dus zelf de kleuren per letter bepalen.
Als je het voor een woord van 100 letters doet is het wel veel werk maar het is dus te manipuleren.
jQuery instap;
http://docs.jquery.com/Tutorials:How_jQuery_Works
ziet er alleen uit al een h**r maar werkt zelfde en misschien nog wel sneller klaar
misschien voor elk woord ff een include met php doen..dan ziet het er iets overzichtelijker uit
Als je het maar 1x gebruikt, denk het wel ja. Het ziet er idd niet uit.quote:
[..]
maar dan kan ik net zo goed alle letters apart een span class meegeven
ziet er alleen uit al een h**r maar werkt zelfde en misschien nog wel sneller klaar
misschien voor elk woord ff een include met php doen..dan ziet het er iets overzichtelijker uit
Voor zover ik kan zien, is het enige wat lettering voor je doet (wat jij wil) is er spans omheen zetten.
Zag in het vorige topic dat de style-informatie werd gewijzigd om het een en ander wel of niet zichtbaar te maken. Tests wijzen uit dat het sneller is om de naam van de class te beïnvloeden in plaats van de declaratie.
Begint ook steeds meer op een front-end topic te lijken, waar html, css en js-vragen allen voorbij komen. Wellicht tijd om dit topic daar naar te noemen, met het javascript topic als backup om specifieke coding-problemen voor te leggen.
edit: heb het in FB voorgelegd: Het grote Digital Corner FB topic
[ Bericht 19% gewijzigd door n8n op 24-06-2011 16:45:08 ]
Begint ook steeds meer op een front-end topic te lijken, waar html, css en js-vragen allen voorbij komen. Wellicht tijd om dit topic daar naar te noemen, met het javascript topic als backup om specifieke coding-problemen voor te leggen.
edit: heb het in FB voorgelegd: Het grote Digital Corner FB topic
[ Bericht 19% gewijzigd door n8n op 24-06-2011 16:45:08 ]
“Specialization is for insects”.—Robert Heinlein
Hullo weer.
Ik ben nu eindelijk weer voor mezelf bezig Ongeveer dan, en daar heb ik weereens een vraag over.
Ik heb een menu, die is 44px hoog, waarin menu-items staan, die zijn wat kleiner. Bij de hover en de active wil ik dat er een afbeelding te zien is. Het probleem is echter dat die wat hoger is dan de items, en nu dus afgesneden wordt naar 12px. Ik heb de menu a, menu ul a, menu ul en menu ul li, ennnn #menu ul li a:hover geprobeerd hoger te maken, maar mijn afbeelding komt steeds niet goed naar voren, hoe krijg ik dit voor elkaar?
Als je een linkje nodig hebt, kun je DM'en.
Ik ben nu eindelijk weer voor mezelf bezig
Ongeveer dan, en daar heb ik weereens een vraag over. Ik heb een menu, die is 44px hoog, waarin menu-items staan, die zijn wat kleiner. Bij de hover en de active wil ik dat er een afbeelding te zien is. Het probleem is echter dat die wat hoger is dan de items, en nu dus afgesneden wordt naar 12px. Ik heb de menu a, menu ul a, menu ul en menu ul li, ennnn #menu ul li a:hover geprobeerd hoger te maken, maar mijn afbeelding komt steeds niet goed naar voren, hoe krijg ik dit voor elkaar?
Als je een linkje nodig hebt, kun je DM'en.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 | #menu{ height:44px; width:900px; background-image:url(''); font-size:13px; background-repeat:repeat-x; line-height:43px; } #menu ul{ color:#fff; } #menu ul li{ display: inline; margin-right:40px; } #menu ul li a{ text-decoration: none; color:#fff; } #menu ul li a:hover{ color:#1a4477; background-image:url(); background-position:center; background-repeat:no-repeat; } |
de <a> display:block maken en de gewenste hoogte of een verticale padding geven. Als het dan werkt is het opgeven van de hoogte voor het menu ook niet meer nodig omdat deze dan de geneste elementen omsluit (toegevoegde waarde voor wie alleen tekst laat schalen).
Ziet er overigens naar uit dat je het <nav> element nodig hebt, <menu> is om opties/wijzigingen binnen een website/applicatie.
Ziet er overigens naar uit dat je het <nav> element nodig hebt, <menu> is om opties/wijzigingen binnen een website/applicatie.
“Specialization is for insects”.—Robert Heinlein
<a> display:inline-block geven zou ook moeten voldoen.
Alternatief is nog om de afbeelding op de li te zetten als de muis over een link wordt bewogen, maar dat lukt alleen als met javascript.
Alternatief is nog om de afbeelding op de li te zetten als de muis over een link wordt bewogen, maar dat lukt alleen als met javascript.
if IE6 negeren en de li:hover een url(); geven. Zou in de normale staat ook de afbeelding linken maar dan buiten zicht, dan werkt het zichtbaar worden van de afbeelding sneller omdat deze al is geladenquote:
<a> display:inline-block geven zou ook moeten voldoen.
Alternatief is nog om de afbeelding op de li te zetten als de muis over een link wordt bewogen, maar dat lukt alleen als met javascript.
“Specialization is for insects”.—Robert Heinlein
Het menu moet wel een hoogte hebben, want die achtergrondafbeelding is 44 hoogquote:
de <a> display:block maken en de gewenste hoogte of een verticale padding geven. Als het dan werkt is het opgeven van de hoogte voor het menu ook niet meer nodig omdat deze dan de geneste elementen omsluit (toegevoegde waarde voor wie alleen tekst laat schalen).
Ziet er overigens naar uit dat je het <nav> element nodig hebt, <menu> is om opties/wijzigingen binnen een website/applicatie.
Wat is nav dan? Menu usually works for me.
Eén voor één een Li gaat niet volgens mij, want ik werk met een cms.. Of ik begrijp je hlemaal verkeerd, wat ik ook niet gek zou vindenquote:
<a> display:inline-block geven zou ook moeten voldoen.
Alternatief is nog om de afbeelding op de li te zetten als de muis over een link wordt bewogen, maar dat lukt alleen als met javascript.
Ik ga even kloten met jullie tips, thanks!
nav is navigatie, menu is http://forum.fok.nl/user/edit_prefs zoiets. Werkt beide maar nav is in het geval van navigatie (waar het op lijkt) semantisch correct.
“Specialization is for insects”.—Robert Heinlein
inline-block werkt! Bedankt.
Met block kreeg ik dat alle menu-items onder elkaar gingen staan en dat er in het midden van het menu een afbeelding kwam te staan
Met block kreeg ik dat alle menu-items onder elkaar gingen staan en dat er in het midden van het menu een afbeelding kwam te staan
oopsquote:
inline-block werkt! Bedankt.
Met block kreeg ik dat alle menu-items onder elkaar gingen staan en dat er in het midden van het menu een afbeelding kwam te staan
let wel dat in IE7 inline-block alleen werkt op elementen die standaard inline toegewezen krijgen (dus werkend in het geval van een anchor-tag). IE6 kan niet overweg met inline-block zover ik weet
“Specialization is for insects”.—Robert Heinlein
Nou ja, dan zien ze maar een half kadootje. Ook la zou het best weleens in het honderd kunnen lopen omdat alle opdrachtgevers volgens mij in IE werken... Ik zoek even op Anchor.quote:
[..]
oops
Edit, hebben ze iig allemaal. Dus moet werken.O en ik snap wat je bedoelt met nav in plaats van menu
Zal er voortaan op gaan letten.
Er staat #menu, dus ik vermoed een div met als id "menu" en niet <nav> of <menu>quote:
de <a> display:block maken en de gewenste hoogte of een verticale padding geven. Als het dan werkt is het opgeven van de hoogte voor het menu ook niet meer nodig omdat deze dan de geneste elementen omsluit (toegevoegde waarde voor wie alleen tekst laat schalen).
Ziet er overigens naar uit dat je het <nav> element nodig hebt, <menu> is om opties/wijzigingen binnen een website/applicatie.
Helemaal correct niet opgemerkt, zit al te diep met m'n nek in html5quote:
[..]
Er staat #menu, dus ik vermoed een div met als id "menu" en niet <nav> of <menu>
“Specialization is for insects”.—Robert Heinlein
Wut? Dat klinkt als xml. Is het bij html5 zo dat <nav> al div id=nav is? Vet. Ik heb echt geen drol geleerd.op stage wat dat betreft
http://html5doctor.com/ is erg duidelijk in het omschrijven van de nieuwe elementen met heldere voorbeelden en discussies bij de artikelen
Nieuw zijn o.a. <header>, <footer>, <nav>, <menu>, <section>, <article> en <aside> om div-vrij te kunnen werken
Nieuw zijn o.a. <header>, <footer>, <nav>, <menu>, <section>, <article> en <aside> om div-vrij te kunnen werken
“Specialization is for insects”.—Robert Heinlein
Klopt het dat 'float' in IE7 niet werkt? Ik wil een afbeelding links van een lap tekst zetten, dus geef ik de 'img' een 'float: left'. Werkt in chrome en IE9, maar niet in IE7.
Heb al een aantal dingen geprobeerd, maar ik krijg het niet werkend.
Iemand?
Heb al een aantal dingen geprobeerd, maar ik krijg het niet werkend.
Iemand?
Weet je zeker dat je geen specifity-probleem o.i.d. hebt? Floats zouden gewoon moeten werken in alle redelijk moderne browsers (lees: zelfs IE6 ondersteunt ze )
)
Nee.
Float werkt al vanaf IE6 dus dat zal waarschijnlijk aan je code liggen.
Ik weet niks van Hindoes. Wel van Samoerai en andere dingen.
HTML:
CSS:
Zou het kunnen liggen aan de tabel? Heb beetje snelle methode genomen om alles mooi te krijgen. Of kan ik beter Div's gebruiken en die inline laten displayen?
| 1 2 3 4 | <tr class='text'> <td><img src='../images/style/icon-book.png' alt='Examen AM-afbeelding'/><p>[tekst]</p></td> <td><img src='../images/style/icon-book.png' alt='Examen AM-afbeelding'/><p>[tekst]</p></td> </tr> |
CSS:
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | #base #content table .text td{ padding: 10px 25px 10px 30px; border-bottom: solid 1px #e6e6e6; } #base #content table .text td p{ font-size: 14px; color: #222222; width: 260px; margin: 0; padding: 0; } #base #content table .text td img{ float: left; margin: 2px 8px 0 0; } |
Zou het kunnen liggen aan de tabel? Heb beetje snelle methode genomen om alles mooi te krijgen. Of kan ik beter Div's gebruiken en die inline laten displayen?
Ligt eraan wat voor data je in die tabel gaat tonen he. Als het tabulaire data is, is een tabel natuurlijk prima. Anders zou ik inderdaad voor een andere, meer semantisch correcte structuur gaan (let wel: dit betekent niet dat je alles maar moet vervangen door <div>'s).
Nee.
quote:
Ligt eraan wat voor data je in die tabel gaat tonen he. Als het tabulaire data is, is een tabel natuurlijk prima. Anders zou ik inderdaad voor een andere, meer semantisch correcte structuur gaan (let wel: dit betekent niet dat je alles maar moet vervangen door <div>'s).
Alleen dit stuk content staat in een tabel omdat je op zo'n manier op een simpele en snelle manier alles goed kan uitlijnen. Maar goed als dit problemen blijft geven schiet ik er niks mee op; in IE schieten namelijk die 3 afbeeldingen boven de tekst uit.
Op
voor tabulaire data, daar zijn ze voorquote:
[..]
I know, maar wat wil je daar mee zeggen? Dat je officieel geen tabellen mag gebruiken?
“Specialization is for insects”.—Robert Heinlein
