[html, css, js] voor dummies #20

Index

» digital corner

» development

actieve topics nieuwe topics
abonnement Unibet Coolblue
pi_105487024
Ik heb het volgende in mijn .htaccess:

1
2
3
4		RewriteEngine On
RewriteBase /
RewriteCond %{HTTP_HOST} !^www\.
RewriteRule ^(.*)$ http://www.%{HTTP_HOST}/$1 [R=301,L]

Die zorgt dat alles naar www. gaat
andersom(niet getest):

1
2
3
4		RewriteEngine On
RewriteBase /
RewriteCond %{HTTP_HOST} ^www\.
RewriteRule ^(.*)$ http://%{HTTP_HOST}/$1 [R=301,L]
💍 💍 💍 💍 💍 💍 🍌 ☎
pi_105487050
Dit is idd niet een HTML vraag :P. Geen idee of hier een topic voor is, maar ik wil wel even kijken of ik dit kan beantwoorden.

Sowieso is zelf een redirect doen beter dan het aangeven bij Google WMT. Ten eerste omdat er meer crawlers zijn dan Google, ten tweede omdat de gebruiker dan ook altijd op dezelfde url terechtkomt.

Het is inderdaad zo simple als een regel in je .htaccess, als ik me niet vergis (niet getest dus) is het:

1
2		RewriteCond %{HTTP_HOST} !^www\.
RewriteRule (.*) http://www.jouwsite.com/$1 [R,L]
pi_105487060
quote:
0s.gif Op maandag 12 december 2011 11:28 schreef Pizzalucht het volgende:
Ik heb het volgende in mijn .htaccess:
[ code verwijderd ]

Dit is inderdaad completer, en iets netter. Toch niet verkeerd voor uit m'n hoofd :P.

De R=301 flag geeft aan Google aan dat het een permanente redirect is, dus beter voor SEO. Die is wel belangrijk in dit geval.
  maandag 12 december 2011 @ 11:33:37 #104
42636 TheSeeker_NL
Damn fine coffee
pi_105487181
Wow super dat jullie zo snel reageren. Ik kan niet echt snel heldere informatie vinden over hoe en wat. Wel dat het schijnbaar belangrijk is voor je SEO :)

Even uitproberen, bedankt mensen ^O^
pi_105487556
Ik kan je aanraden om op SEOmoz.org en SearchEngineLand.com rond te neuzen.
  maandag 12 december 2011 @ 14:51:57 #106
42636 TheSeeker_NL
Damn fine coffee
pi_105493400
quote:
14s.gif Op maandag 12 december 2011 11:45 schreef picodealion het volgende:
Ik kan je aanraden om op SEOmoz.org en SearchEngineLand.com rond te neuzen.
Bedankt voor de tip! Een berg aan informatie :D
  dinsdag 13 december 2011 @ 10:51:47 #107
84244 Scorpie
Abject en infaam!
pi_105527681
Ik ben op zoek naar een gallery-achtige plugin/framework die images en video in een set (dus door elkaar) kan afspelen. De meeste examples werken met images of flash only, ben er nog geen 1 tegengekomen die alles door elkaar heen afspeelt met de mogelijkheid tot autoplay.

Iemand hints / tips?
Op dinsdag 13 augustus schreef Xa1pt:
Neuh, fraude mag best aangepakt worden. Maar dat het de maatschappij meer oplevert of beter is voor de samenleving, is nog maar de vraag.
Op donderdag 25 juni 2015 schreef KoosVogels:
Klopt. Ik ben een racist.
  dinsdag 13 december 2011 @ 10:52:25 #108
56176 Catch22-
Ben je Blind?!
pi_105527695
Je kan niet zelf coden begrijp ik?
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
  dinsdag 13 december 2011 @ 10:58:09 #109
84244 Scorpie
Abject en infaam!
pi_105527883
Wat is dat nou weer voor vraag :D ik ga toch geen lightbox clone bouwen als er al 1 is die het meeste werk voor me doet :P
Op dinsdag 13 augustus schreef Xa1pt:
Neuh, fraude mag best aangepakt worden. Maar dat het de maatschappij meer oplevert of beter is voor de samenleving, is nog maar de vraag.
Op donderdag 25 juni 2015 schreef KoosVogels:
Klopt. Ik ben een racist.
  dinsdag 13 december 2011 @ 10:59:21 #110
4159 GI
Nee ik heet geen JOE
pi_105527926
quote:
10s.gif Op dinsdag 13 december 2011 10:58 schreef Scorpie het volgende:
Wat is dat nou weer voor vraag :D ik ga toch geen lightbox clone bouwen als er al 1 is die het meeste werk voor me doet :P
http://jquery.com/demo/thickbox/
  dinsdag 13 december 2011 @ 11:00:17 #111
4159 GI
Nee ik heet geen JOE
pi_105527959
O, niet meer ondersteunt. Maar er is vast iets van dezelfde strekking
  dinsdag 13 december 2011 @ 11:07:01 #112
84244 Scorpie
Abject en infaam!
pi_105528124
Mja ik vond zelf deze: http://planetozh.com/projects/lightbox-clones/

Daar staan er een hoop op. Ga daar wel mee aan de slag :)
Op dinsdag 13 augustus schreef Xa1pt:
Neuh, fraude mag best aangepakt worden. Maar dat het de maatschappij meer oplevert of beter is voor de samenleving, is nog maar de vraag.
Op donderdag 25 juni 2015 schreef KoosVogels:
Klopt. Ik ben een racist.
  dinsdag 13 december 2011 @ 14:30:10 #114
12221 Tijn
Powered by MS Paint
pi_105534838
Ik gebruik zelf altijd FancyBox. Lekker fancy :7
Verberg de nieuwsticker
  dinsdag 13 december 2011 @ 14:41:18 #115
56176 Catch22-
Ben je Blind?!
pi_105535384
fancybox ruled, is net een nieuwe van uit he.
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
  dinsdag 13 december 2011 @ 23:33:31 #116
228072 Crimyclown
Sapper de fap!
pi_105559424
Is het mogelijk met CSS type verticaal in een DIV te centreren.
Anonieme tievesclown
  woensdag 14 december 2011 @ 00:07:21 #117
12221 Tijn
Powered by MS Paint
pi_105560634
Wat is tegenwoordig een goede manier om bijvoorbeeld een menu altijd in beeld te houden, ook als je naar beneden scrollt?
Verberg de nieuwsticker
pi_105561710
Je zou position: fixed kunnen gebruiken. Maar ik raad het niet aan.

Ik zou zelf denk ik voor een JS oplossing gaan(met animation) om een soort "fixed", maar dan mooier, te kunnen krijgen, en hier dan een fallback naar position: fixed gebruiken ;)

Zoiets:
http://www.jtricks.com/javascript/navigation/floating.html
💍 💍 💍 💍 💍 💍 🍌 ☎
pi_105562805
quote:
0s.gif Op woensdag 14 december 2011 00:50 schreef Pizzalucht het volgende:
Je zou position: fixed kunnen gebruiken. Maar ik raad het niet aan.

Ik zou zelf denk ik voor een JS oplossing gaan(met animation) om een soort "fixed", maar dan mooier, te kunnen krijgen, en hier dan een fallback naar position: fixed gebruiken ;)

Zoiets:
http://www.jtricks.com/javascript/navigation/floating.html
ALsjeblieft, hou op. Het is geen 2004 meer ;(

Position:fixed is idd de oplossing. Wat veel gedaan wordt is dmv javascript de scrollpositie uitlezen, zodat je een menu fixed kan zetten zodra het uit beeld dreigt te scrollen. Bijv. een menubalk onder een banner, die fixed wordt zodra je de banner uit beeld gescrolled hebt. Voorbeeld is bijv. te ticker bij facebook, .fixed_scrolling_wrapper wordt fixed gemaakt zodra je de ads erboven weggescrold hebt.

Je moet overigens wel nadenken over de impact van fixed elementen op kleine schermen (netbooks, telefoons). Als je niet oppast zet je 90% van het beeld vol met menu's die niet weg te scrollen zijn.
zcflevo.nl
  woensdag 14 december 2011 @ 01:40:36 #120
12221 Tijn
Powered by MS Paint
pi_105563013
Ja, door dat hele gedachtenproces ben ik net ook gegaan. Nu is het nog een klein menuutje en leek het me cool om 'em altijd op de pagina te houden. Maar de inhoud is variabel en gaat zeker groeien. Dat in combinatie met de kleine schermen van telefoons en tablets zorgt er al gauw voor dat het alleen maar irritant is dat 'ie fixed is.

Maar ik ben wel blij dat ik nu weet hoe het moet, mocht ik het ooit wél willen B-)
Verberg de nieuwsticker
  woensdag 14 december 2011 @ 10:59:13 #121
305897 remi1986
This MF is infected by madness
pi_105568571
Ik maak gebruik van de jQuery autocomplete: http://docs.jquery.com/Plugins/Autocomplete

Nu wil ik de url kunnen wijzigen aan de hand van een keuze uit een select box. Volgens de documentatie kan dat met setOptions http://docs.jquery.com/Plugins/Autocomplete/setOptions#options

1
2
3
4
5
6
7
8
9
10		$("#id_van_input_veld").autocomplete("url_naar_php_bestand_1",{
      //hier een aantal opties
});

$("#id_van_select").change(function() {
     $("#id_van_input_veld").flushCache();
     $("#id_van_input_veld").setOptions(function() {
            url: 'url_naar_php_bestand_2'
     });
});

Echter, hier gebeurt niks mee. De url wordt niet veranderd. Ook krijg ik met Firebug geen foutmeldingen.

Ik heb nu een tijdelijke oplossing door bij het teruggeven van het resultaat in Javascript (in de success: van de autocomplete) te controleren op de waarde in de selectbox, maar hiervoor worden teveel records opgehaald, dus ik wil het resultaat verfijnen in het AJAX php bestand.

Heeft iemand een idee wat er niet klopt?
  woensdag 14 december 2011 @ 11:23:23 #122
56176 Catch22-
Ben je Blind?!
pi_105569257
Kan je niet beter de waarde van de select meeposten en het door 1 file laten afhandelen?
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
pi_105569735
quote:
10s.gif Op woensdag 14 december 2011 01:40 schreef Tijn het volgende:
Ja, door dat hele gedachtenproces ben ik net ook gegaan. Nu is het nog een klein menuutje en leek het me cool om 'em altijd op de pagina te houden. Maar de inhoud is variabel en gaat zeker groeien. Dat in combinatie met de kleine schermen van telefoons en tablets zorgt er al gauw voor dat het alleen maar irritant is dat 'ie fixed is.

Maar ik ben wel blij dat ik nu weet hoe het moet, mocht ik het ooit wél willen B-)
Idd, ik heb het laatst op mijn werk ook gemaakt (precies hoe KomtTijd.. zegt), maar ik zet er wel altijd een rule bij dat bij < 600px breedte dat gewoon niet gebeurt.
  woensdag 14 december 2011 @ 11:52:13 #124
305897 remi1986
This MF is infected by madness
pi_105570135
quote:
11s.gif Op woensdag 14 december 2011 11:23 schreef Catch22- het volgende:
Kan je niet beter de waarde van de select meeposten en het door 1 file laten afhandelen?
Ja dat wil ik ook. Echter de autocomplete zet je op in de Document Ready. En op de één of andere manier wordt dit gecached. Ik wil dus on the fly de url veranderen, wanneer de waarde van de selectbox veranderd
pi_105614076
Ik probeer text in een div tag te centreren.

1
2
3
4		 #test3 li a {
    vertical-align:middle;
    line-height: 102px;
}

maar dit werkt enkel wanneer er maar 1 regel tekst is. Nu heb ik in #test3 2 regels tekst welke ik verticaal gecentreerd wil hebben in de div tag. De regels ten opzichte van elkaar moeten een normale line-height krijgen. Is dit mogelijk?
Anonieme tievesclown
pi_105614234
Je zou het kunnen proberen met display:table/display:table-cell.
Bleuh.
pi_105614442
Lukt ook niet, anders zet ik de content van de div gewoon in een table zetten met v-align erop.
Anonieme tievesclown
  donderdag 15 december 2011 @ 13:45:54 #128
56176 Catch22-
Ben je Blind?!
pi_105614469
doe je ontwerp eens posten + code, kan me niet voorstellen dat dit niet anders kan.
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
  donderdag 15 december 2011 @ 13:53:21 #129
220026 Treces
Hier had uw tekst kunnen staan
pi_105614699
Je zou het met jQuery kunnen doen :)
pi_105614711
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
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53		<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="http://cdn.jquerytools.org/1.2.5/jquery.tools.min.js"></script>
<script type="text/javascript" src="scripts/jquery.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>FOKTEST</title>
<style>
body {
    margin:0;
    padding:0;
    font-family:Verdana, Geneva, sans-serif;
    font-size:12px;
    font-weight: bold;
    text-align: center;
    background-color:#999;
}
#container {
    width:1024px;
    height:768px;
    margin:0 auto;
    background-color:#0D2B41;
}
/* Button */
ul {
    list-style: none;
    padding:0px;
    margin:0px;
}
#button3 li a {
    vertical-align:middle;
    line-height: 102px;
}
#button3 {
    position:absolute;
    margin-top:510px;
    margin-left:306px;
    height:102px;
    width:102px;
    background-color:#FFF;
}
</style>
</head>
<body>
<div id="container">
<div id="button3">
<ul id="knop3">
<li><a href="#">TESTKNOP DRIE</a></li>
</ul>
</div>
</div>
</body>
</html>
Anonieme tievesclown
pi_105614857
quote:
0s.gif Op donderdag 15 december 2011 13:53 schreef Treces het volgende:
Je zou het met jQuery kunnen doen :)
Dat zou wel ideaal zijn. Even uitproberen.

[ Bericht 1% gewijzigd door Crimyclown op 15-12-2011 14:04:59 ]
Anonieme tievesclown
  donderdag 15 december 2011 @ 14:08:37 #132
56176 Catch22-
Ben je Blind?!
pi_105615127
http://jsbin.com/orucev/4/

zoiets. ff naar je eigen wens aanpassen

waarom staat die knop in een UL btw?

http://jsbin.com/orucev/9
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
pi_105615699
quote:
11s.gif Op donderdag 15 december 2011 14:08 schreef Catch22- het volgende:
http://jsbin.com/orucev/4/

zoiets. ff naar je eigen wens aanpassen

waarom staat die knop in een UL btw?

http://jsbin.com/orucev/9
Om dat ding te centreren van alles geprobeerd. Dacht misschien kan een ul wel gecentreerd worden.
Anonieme tievesclown
pi_105615944
Bedankt Catch22-, het werkt.
Anonieme tievesclown
  vrijdag 16 december 2011 @ 18:23:51 #135
228072 Crimyclown
Sapper de fap!
pi_105664643
Is iemand hier toevallig bekent met CMS Made Simple? Kan op de website vreemd genoeg niet de informatie vinden die ik zoek. Zou graag een link naar een nieuwe pagina/sjabloon maken. Of moet ik sjablonen niet als html pagina zien?

Testpagina
1<div id="button1" style="cursor:hand; cursor:pointer;" onclick="location.href='testpagina">
Anonieme tievesclown
pi_105664933
quote:
0s.gif Op vrijdag 16 december 2011 18:23 schreef Crimyclown het volgende:
Is iemand hier toevallig bekent met CMS Made Simple? Kan op de website vreemd genoeg niet de informatie vinden die ik zoek. Zou graag een link naar een nieuwe pagina/sjabloon maken. Of moet ik sjablonen niet als html pagina zien?

Testpagina
[ code verwijderd ]

Probeer eerst eens zelf te begrijpen wat je nou wilt, dat zoekt al een stuk makkelijker :+
Een nieuwe pagina of een nieuw sjabloon zijn wel 2 behoorlijk verschillende dingen. En wat die code ermee te maken heeft...? :?
zcflevo.nl
pi_105696778
Iemand een idee hoe ik dit voor elkaar krijg met css?



Ik zit al te pielen met text-shadow maar daarbij heb ik 2 opties:

- de shadow direct achter de tekst laten, en de blur op 4px zetten. Lijkt er enigszins op, maar het moet met strakke lijnen ipv geblurred
- 4 shadows instellen voor de 4 richtingen. lijkt er meer op, maar de hoeken zijn dan erg lelijk:

http://jsfiddle.net/38mM6/1/ (1px blur om het iets zachter te maken, anders is het nog blokkeriger..)

Lijkt het allemaal niet te worden.

[ Bericht 29% gewijzigd door picodealion op 17-12-2011 17:16:09 ]
pi_105697021
Hmm, al begint dit wel wat te worden..
http://jsfiddle.net/38mM6/2/
  zaterdag 17 december 2011 @ 19:01:01 #139
298746 Dalando
18, niet meer gefrustreerd
pi_105700197
Volgensmij zijn de meeste gradients en shadows zijn in browser niet heel vloeiend inderdaad... Bijvoorbeeld op http://dalando.nl/ zie je ook dat de achtergrond gradient niet geheel vloeiend is... Dus volgensmij kun je het niet echt beter krijgen...
Spel-, taal- en grammaticafouten voorbehouden.
994a040db3f025e25771e045468fc121
pi_105700343
Daar was ik al bang voor, toch bedankt :).

Ik zal eens met de opdrachtgever overleggen of het echt niet anders kan. In het aangeleverde design zijn het plaatjes (nu 5 stuks, maar je weet nooit wat er verandert/uitbreidt). Niet ideaal, imo.
  zaterdag 17 december 2011 @ 23:31:54 #141
228072 Crimyclown
Sapper de fap!
pi_105710155
quote:
14s.gif Op vrijdag 16 december 2011 18:32 schreef KomtTijd... het volgende:

[..]

Probeer eerst eens zelf te begrijpen wat je nou wilt, dat zoekt al een stuk makkelijker :+
Een nieuwe pagina of een nieuw sjabloon zijn wel 2 behoorlijk verschillende dingen. En wat die code ermee te maken heeft...? :?
A bedankt, ik heb het gevonden. Dacht dat sjablonen voor html pagina's stonden. Het is allemaal ook een stuk logischer ook nu.

Maar de handleiding op CMSMS heb ik ook niet heel veel aangehad. Informatie die er staat is zeer minimaal.
Anonieme tievesclown
pi_105711402
quote:
14s.gif Op zaterdag 17 december 2011 23:31 schreef Crimyclown het volgende:

[..]

A bedankt, ik heb het gevonden. Dacht dat sjablonen voor html pagina's stonden. Het is allemaal ook een stuk logischer ook nu.

Maar de handleiding op CMSMS heb ik ook niet heel veel aangehad. Informatie die er staat is zeer minimaal.
Ben ik met je eens, die handleiding is een beetje crappy. Gelukkig is de werkwijze supermakkelijk en overzichtelijk, en de modulehulp-pagina's e.d. zijn wel duidelijk.
zcflevo.nl
pi_105712893
Ik ben nog maar net bezig met CSS, al heel vaak geprobeerd het onder de knie te krijgen, maar liep steeds vast. Dit is dus de ik weet niet hoeveelste poging en loop alweer vast :')

Kijk hier wat het probleem is. Ik krijg 2 'containers' in een container, niet naast elkaar.
pi_105713004
Probeer eens een float:left; op de div van het logo ;)
💍 💍 💍 💍 💍 💍 🍌 ☎
pi_105713009
Beide containers zijn 'div' elementen, die hebben als display waarde "block". Die stapelen altijd onder elkaar.

Een mogelijke oplossing is om er met css inline-blocks van te maken, blokken die dus naast elkaar blijven staan:

1#logo, #menu { display: inline-block; }

Of je kan ze allebei naar links floaten:

1#logo, #menu { float: left; }

Inline-block wordt niet door oude browsers (IE 6 enzo) ondersteund, maar tegenwoordig kunnen de meeste browsers er wel mee omgaan. Float wordt wel altijd ondersteund, maar is lastiger onder de knie te krijgen.
pi_105713066
Float kan ook nog wel eens problemen opleveren in oudere browsers, maar die zijn meestal met wat hack-werk wel weer recht te breien. Liever lelijke code dan slechte ondersteuning.
💍 💍 💍 💍 💍 💍 🍌 ☎
pi_105713369
Thanks!

Div's worden dus altijd onderelkaar gestapeld? Hoe voorkom je dit?

Ik ga nu even float left proberen.

/edit
1    #logo, #menu { display: inline-block; }
Heeft het opgelost, maar is dit hoe 'het' moet?

/edit
En wat is het beste om een plaatje/iets verticaal te centreren?
pi_105713469
Er zijn eigenlijk altijd meerdere manieren om iets te bereiken, maar als je voor compatibiliteit gaat, zou ik toch voor float gaan.

Lees even vanaf hier voor verticaal centreren.
💍 💍 💍 💍 💍 💍 🍌 ☎
pi_105713500
quote:
0s.gif Op zondag 18 december 2011 01:37 schreef Pizzalucht het volgende:
Er zijn eigenlijk altijd meerdere manieren om iets te bereiken, maar als je voor compatibiliteit gaat, zou ik toch voor float gaan.

Lees even vanaf hier voor verticaal centreren.
Thanks, ga ik straks gelijk even doen!

De blokken zijn nu wel naast elkaar, maar de hoogte van de blokken kloppen niet meer? Ze lopen niet gelijk.

/edit
Door float wel, met inline-block niet. Opgelost dus.
pi_105713548
Met floats moet je inderdaad specifieke afmetingen meegeven ;)
💍 💍 💍 💍 💍 💍 🍌 ☎
actieve topics nieuwe topics
abonnement Unibet Coolblue
[html, css, js] voor dummies #20
Index

» digital corner

» development

Forum Opties
Forumhop:
Hop naar:
(afkorting, bv 'KLB')