[html, css, js] Frontend is het nieuwe backend

zondag 5 mei 2013 @ 16:40:28 #52

Holograph

Compay Segundo

Opnieuw een vraag; ik ben bezig met mijn website te bouwen. Onderaan de website wil ik een zwarte balk hebben voor wat extra tekst. Ik heb mijn CSS-code daarop gemaakt, maar ik zie de balk onderaan de pagina echter niet verschijnen. Wat doe ik verkeerd?

style.css

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
54

        body, html, #map {
        margin: 0;
        width: 100%;
        height: 85%;
        }

        #bovenkant{
        width: 100%;
        height: 40px;
        background-color: black;
        text-align: center;
            line-height: 150%;
            vertical-align: middle;
            color: white;
            font-weight: bold;
            font-size: 18px;
            font-family: "Trebuchet MS", Arial, Helvetica, sans-serif
        }

        #box{
            width: 300px;
            background: rgba(0,0,0,0.8);
            z-index: 1000;
            position: absolute;
            top: 50px;
            left: 50px;
            color: white;
            padding: 10px;
            border-radius: 10px;
            -moz-border-radius: 10px;
            -o-border-radius: 10px;
            -webkit-border-radius: 10px;
            -ms-border-radius: 10px;
        }

        #midden{
        position: absolute;
        background-color: #DBA901;
        width: 100%;
        height: 750px;
        }

        #onderkant{
        width: 100%;
        height: 40px;
        background-color: black;
        text-align: left;
            line-height: 150%;
            vertical-align: middle;
            color: white;
            font-weight: bold;
            font-size: 11px;
            font-family: "Trebuchet MS", Arial, Helvetica, sans-serif
        }

index.php

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

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="nl">
  <head>
    <title>Google Maps API V3</title>
    <link rel="stylesheet" href="./css/style.css" type="text/css">
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDypT9N2T2imUPhILy_zfWJP1EGUiSTDKY&sensor=false"></script>
    <script type="text/javascript" src="./js/kaart.php"></script>

  </head>
<body onload="getMap()">
<div id="bovenkant"><? echo MENU; ?></div>

<div id="map">
</div>

<div id="box">

    <b><? echo INDEX_BOX_WELKOM; ?></b>

    <p><? echo INDEX_BOX_INHOUD; ?></p>

</div>

<div id="midden">
</div>

<div id="onderkant">
</div>

</body>

</html>

De div id 'onderkant' staat duidelijk onder div id 'midden'. Het lijkt er echter op dat div id 'midden' alleen wordt weergeven.

zondag 5 mei 2013 @ 16:51:57 #53

Dimauro

Vuurbezweerder

#midden{
position: absolute;

Ik denk dat het aan de absolute positie van je #midden div ligt.

I'm not the girl in the picture..

zondag 5 mei 2013 @ 16:53:29 #54

Holograph

Compay Segundo

quote:
Op zondag 5 mei 2013 16:51 schreef Dimauro het volgende:
#midden{
position: absolute;

Ik denk dat het aan de absolute positie van je #midden div ligt.

Thanks! Dat heeft geholpen

zondag 5 mei 2013 @ 18:12:31 #55

Crimyclown

Sapper de fap!

Is het mogelijk een CMS achter een applicatie te stoppen (Android app).

Anonieme tievesclown

zondag 5 mei 2013 @ 20:34:36 #56

Maringo

Bèhèhèhèh

quote:
Op zondag 5 mei 2013 18:12 schreef Crimyclown het volgende:
Is het mogelijk een CMS achter een applicatie te stoppen (Android app).

Ja, maar waarom?

Die volg topic-knop hè...
Op 02-06-2014 16:38 schreef Moeraskat
Je bent te goed voor de mensheid.

zondag 5 mei 2013 @ 21:22:26 #57

boem-dikkie

Jedi Mind Baby!

quote:
Op zondag 5 mei 2013 18:12 schreef Crimyclown het volgende:
Is het mogelijk een CMS achter een applicatie te stoppen (Android app).

Natuurlijk. Data ophalen met JSON is daar een goede methode voor.

Ik weet niks van Hindoes. Wel van Samoerai en andere dingen.

maandag 6 mei 2013 @ 09:41:03 #58

Catch22-

Ben je Blind?!

quote:
Op zondag 5 mei 2013 20:34 schreef Maringo het volgende:

[..]

Ja, maar waarom?

in de regel is dit een matig idee ja.

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?

maandag 6 mei 2013 @ 10:24:08 #59

KomtTijd...

Er valt niets zinnigs op te zeggen zonder te weten watvoor app het is.

zcflevo.nl

maandag 6 mei 2013 @ 12:11:11 #60

Holograph

Compay Segundo

Mijn site is bijna af, ik stuit alleen op de laatste problemen:

Onderaan mijn website heb ik twee boxen staan voor informatie e.d. Het probleem is alleen dat de boxen meesschuiven op het moment dat ik mijn internet venster kleiner maakt. Hierdoor komt rechter box onder de linker box te staan, wat er totaal niet uitziet. Het liefst zou ik willen dat ze gewoon allebei in het midden van de pagina (blijven) staan.

http://jsfiddle.net/VTe8P/1/

Weet iemand hier een oplossing voor? Het betreffen #box_midden_inhoud en #box_midden_inhoud1.

maandag 6 mei 2013 @ 13:58:50 #61

Crimyclown

Sapper de fap!

quote:
Op zondag 5 mei 2013 20:34 schreef Maringo het volgende:

[..]

Ja, maar waarom?

Om content in de applicatie beheersbaar te maken. Er zit veel informatie in die door de opdrachtgever gewijzigd moeten kunnen worden. Ik ga niet elke keer een nieuwe code voor hem schrijven.

quote:
Op zondag 5 mei 2013 21:22 schreef boem-dikkie het volgende:

[..]

Natuurlijk. Data ophalen met JSON is daar een goede methode voor.

Bedankt

.

Anonieme tievesclown

maandag 6 mei 2013 @ 14:32:58 #62

Dimauro

Vuurbezweerder

quote:
Op maandag 6 mei 2013 12:11 schreef Holograph het volgende:
Mijn site is bijna af, ik stuit alleen op de laatste problemen:

Onderaan mijn website heb ik twee boxen staan voor informatie e.d. Het probleem is alleen dat de boxen meesschuiven op het moment dat ik mijn internet venster kleiner maakt. Hierdoor komt rechter box onder de linker box te staan, wat er totaal niet uitziet. Het liefst zou ik willen dat ze gewoon allebei in het midden van de pagina (blijven) staan.

http://jsfiddle.net/VTe8P/1/

Weet iemand hier een oplossing voor? Het betreffen #box_midden_inhoud en #box_midden_inhoud1.

1
2
3
4
5
6

*knip*..#box_midden_inhoud1{
        width: 500px;
        height:auto;

        margin-left:auto;
        margin-right:auto;..*knip*

en dan de float weghalen ?

I'm not the girl in the picture..

woensdag 8 mei 2013 @ 14:15:37 #63

InTrePidIvity

Looks like it's broken...

Ik heb één <section> waarbinnen ik zowel een ol als een ul heb staan. Hoe style ik de li's die daarin staan beiden afzonderlijk, zonder er een class aan mee te geven? _{Volgens mij is het iets heel simpels, dat ik over het hoofd zie...}

...it's rielie broken... It's rielie, rielie broken... Let's go wecycle!
[Tournament] Beste Remake

woensdag 8 mei 2013 @ 14:16:47 #64

Crutch

Filantroop || Taalzwengel

1
2
3
4
5
6
7

section ol li
{
}

section ul li
{
}

http://jsfiddle.net/DruSS/

Zo geef je specifiek aan welke <li>'s je wil hebben.

[ Bericht 32% gewijzigd door Crutch op 08-05-2013 14:23:15 ]

Je moeder is een hamster

woensdag 8 mei 2013 @ 14:24:43 #65

InTrePidIvity

Looks like it's broken...

quote:
Op woensdag 8 mei 2013 14:16 schreef Crutch het volgende:

[ code verwijderd ]

http://jsfiddle.net/DruSS/

Zo geef je specifiek aan welke <li>'s je wil hebben.

Ik zal wel iets niet goed gedaan hebben, dit dacht ik namelijk al geprobeerd te hebben. Dankjewel in elk geval

...it's rielie broken... It's rielie, rielie broken... Let's go wecycle!
[Tournament] Beste Remake

woensdag 8 mei 2013 @ 14:25:30 #66

Crutch

Filantroop || Taalzwengel

quote:
Op woensdag 8 mei 2013 14:24 schreef InTrePidIvity het volgende:

[..]

Ik zal wel iets niet goed gedaan hebben, dit dacht ik namelijk al geprobeerd te hebben. Dankjewel in elk geval

Als dat nog steeds niet werkt, kun je dan je css eens posten?

Je moeder is een hamster

woensdag 8 mei 2013 @ 14:43:34 #67

InTrePidIvity

Looks like it's broken...

quote:
Op woensdag 8 mei 2013 14:25 schreef Crutch het volgende:

[..]

Als dat nog steeds niet werkt, kun je dan je css eens posten?

Ik schreef het niet helemaal duidelijk op: jouw oplossing werkt perfect, maar ik dacht dat ik dat eerder al geprobeerd had zonder succes. Zal eerder wel iets fout gedaan hebben

...it's rielie broken... It's rielie, rielie broken... Let's go wecycle!
[Tournament] Beste Remake

woensdag 8 mei 2013 @ 14:44:26 #68

Crutch

Filantroop || Taalzwengel

quote:
Op woensdag 8 mei 2013 14:43 schreef InTrePidIvity het volgende:

[..]

Ik schreef het niet helemaal duidelijk op: jouw oplossing werkt perfect, maar ik dacht dat ik dat eerder al geprobeerd had zonder succes. Zal eerder wel iets fout gedaan hebben

Oh ok.

Nou ja opgelost dus.

Je moeder is een hamster

vrijdag 10 mei 2013 @ 20:04:42 #69

Qontroller

Dit zal ongetwijfeld één van de meest simpele en domme noobvragen zijn, maar hier komt 'ie dan:

Comments in code worden genegeerd door de webbrowser, alleen ze zijn wel zichtbaar in programmeerprogramma's e.d.; zorgen comments voor een hoger verbruik van de bandwidth? Dus worden comments meegenomen door de browsers bij het versturen van de data naar de gebruiker

vrijdag 10 mei 2013 @ 20:15:20 #70

KomtTijd...

Het versturen van de browser naar de gebruiker? Je bedoelt het licht wat je monitor uitstraalt?

_{Als je HTML-comments bedoelt is het antwoord op de vraag die je bedoelt te stellen (Dataverkeer tussen server en browser) uiteraard "ja".}

zcflevo.nl

vrijdag 10 mei 2013 @ 20:18:49 #71

Maringo

Bèhèhèhèh

Ze zijn ook zichtbaar in de browser als je de broncode bekijkt.

Die volg topic-knop hè...
Op 02-06-2014 16:38 schreef Moeraskat
Je bent te goed voor de mensheid.

vrijdag 10 mei 2013 @ 20:19:49 #72

Qontroller

Dan haal ik de comments er uit, thanks!

vrijdag 10 mei 2013 @ 20:25:18 #73

Maringo

Bèhèhèhèh

quote:
Op vrijdag 10 mei 2013 20:19 schreef Qontroller het volgende:
Dan haal ik de comments er uit, thanks!

Why.. Ze bestaan niet voor niets. Of bedoel je dat je comments in je html heb staan?

Die volg topic-knop hè...
Op 02-06-2014 16:38 schreef Moeraskat
Je bent te goed voor de mensheid.

vrijdag 10 mei 2013 @ 20:29:34 #74

Qontroller

quote:
Op vrijdag 10 mei 2013 20:25 schreef Maringo het volgende:

[..]

Why.. Ze bestaan niet voor niets. Of bedoel je dat je comments in je html heb staan?

Ja dat bedoel ik

vrijdag 10 mei 2013 @ 21:24:49 #75

KomtTijd...

Yes. Weer 100 bytes bespaard.

zcflevo.nl

vrijdag 10 mei 2013 @ 21:40:33 #76

Devv

Maken jullie ook gebruik van die hippe waterfall chart in Firefox om responsiveness te testen?

zaterdag 11 mei 2013 @ 07:42:40 #77

Maringo

Bèhèhèhèh

quote:
Op vrijdag 10 mei 2013 21:40 schreef Devv het volgende:
Maken jullie ook gebruik van die hippe waterfall chart in Firefox om responsiveness te testen?

Ik gebruik de code van dit:
http://mattkersley.com/responsive/

Die volg topic-knop hè...
Op 02-06-2014 16:38 schreef Moeraskat
Je bent te goed voor de mensheid.

zaterdag 11 mei 2013 @ 10:14:37 #78

gerrit098

Graag wil ik dat achter mijn content een zwarte transparante laag komt zodat het goed lees baar op de foto`s

nu heb ik dat gedaan met onderstaande code.

1 2	#content > ul > li {position:absolute;height:100% ;width:100%; } .box1 {background: rgba(0,0,0,0.9);;width:100%;height:100%;position:absolute;top:0;left:0 ;padding:10px }

het probleem is dat hij 100% hoogte neemt van het scherm en niet van de content dus zodra je gaat scrollen gebeurt er dit.

http://jjfoto.eu5.org/web.jpg

nu kan ik dat oplossen door het percentage in een aantal pixels te veranderen, alleen dan wordt ie ook langer als de content korter is.

weet iemand hoe ik dit moet oplossen??

zaterdag 11 mei 2013 @ 10:25:24 #79

PimD

Nee.

Absoluut positioneren gaat a.d.h.v. de dichtstbijzijnde gepositioneerde parent. Dus als je een parent element "position:relative;" geeft zal ie niet meer het hele scherm beslaan.

Nee.

zaterdag 11 mei 2013 @ 10:37:33 #80

gerrit098

quote:
Op zaterdag 11 mei 2013 10:25 schreef PimD het volgende:
Absoluut positioneren gaat a.d.h.v. de dichtstbijzijnde gepositioneerde parent. Dus als je een parent element "position:relative;" geeft zal ie niet meer het hele scherm beslaan.

Hartelijk dank!

zaterdag 11 mei 2013 @ 14:18:45 #81

xaban06

Ik ben vrij nieuw met CSS, ik begin het steeds beter onder de knie te krijgen. Mijn vraag is, wat is DE manier om 'afwijkende' lettertypes te gebruiken? Ik bedoel dus fonts die standaard op een computer niet geinstalleerd zijn.

zaterdag 11 mei 2013 @ 14:39:58 #82

picodealion

http://www.fontsquirrel.com/ en dan Webfont Generator. Alles wat je ooit nodig hebt.

zaterdag 11 mei 2013 @ 14:46:13 #83

Devv

quote:
Op zaterdag 11 mei 2013 07:42 schreef Maringo het volgende:

[..]

Ik gebruik de code van dit:
http://mattkersley.com/responsive/

Ik had het meer over het laden van web onderdelen

. Maar dat is ook wel een handige tool.

zaterdag 11 mei 2013 @ 15:07:13 #84

Tijn

Powered by MS Paint

quote:
Op zaterdag 11 mei 2013 14:39 schreef picodealion het volgende:
http://www.fontsquirrel.com/ en dan Webfont Generator. Alles wat je ooit nodig hebt.

Ik kijk altijd eerst even bij Google Fonts, dat is verreweg de makkelijkste manier om een ander font op je website te krijgen.

Verberg de nieuwsticker

zaterdag 11 mei 2013 @ 15:08:11 #85

picodealion

Die kende ik niet

.

zaterdag 11 mei 2013 @ 15:09:22 #86

donroyco

dus niet Donroyco

quote:
Op zaterdag 11 mei 2013 15:08 schreef picodealion het volgende:
Die kende ik niet .

Serieus?

Op maandag 29 september 2008 11:45 schreef HostiMeister het volgende:
Dat is zeg maar de Nederlandse taal op een vuige keukentafel voorover buigen en hem dan zonder glijmiddel anaal verkrachten. :'(

zaterdag 11 mei 2013 @ 15:10:58 #87

picodealion

Nee grapje haha kende ik allang

SPOILER
Om spoilers te kunnen lezen moet je zijn ingelogd. Je moet je daarvoor eerst gratis Registreren. Ook kun je spoilers niet lezen als je een ban hebt.

zaterdag 11 mei 2013 @ 15:24:24 #88

Catch22-

Ben je Blind?!

Als je maar nooit fontsquirrelfonts voor tekst kleiner dan 18-22pixels gebruikt. Die fonts Zijn dan vaak onleesbaar.

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?

zaterdag 11 mei 2013 @ 16:09:16 #89

xaban06

quote:
Op zaterdag 11 mei 2013 15:07 schreef Tijn het volgende:

[..]

Ik kijk altijd eerst even bij Google Fonts, dat is verreweg de makkelijkste manier om een ander font op je website te krijgen.

Is Google fonts cross browser compatible?

Als ik naar de source kijken maakt het gebruik van .woff

zaterdag 11 mei 2013 @ 16:13:11 #90

Tijn

Powered by MS Paint

quote:
Op zaterdag 11 mei 2013 16:09 schreef xaban06 het volgende:

[..]

Is Google fonts cross browser compatible?

Als ik naar de source kijken maakt het gebruik van .woff

Ik heb geen idee wat ze precies doen, maar het werkt in alle browsers prima.

Verberg de nieuwsticker

zaterdag 11 mei 2013 @ 16:22:16 #91

donroyco

dus niet Donroyco

quote:
Op zaterdag 11 mei 2013 16:09 schreef xaban06 het volgende:

[..]

Is Google fonts cross browser compatible?

Als ik naar de source kijken maakt het gebruik van .woff

Dat verschilt natuurlijk per browser.

Op maandag 29 september 2008 11:45 schreef HostiMeister het volgende:
Dat is zeg maar de Nederlandse taal op een vuige keukentafel voorover buigen en hem dan zonder glijmiddel anaal verkrachten. :'(

zaterdag 11 mei 2013 @ 17:52:31 #92

Devv

Zolang je geen IE8 gebruikt, is het wel cross-browser

.

zaterdag 11 mei 2013 @ 17:55:00 #93

Tijn

Powered by MS Paint

quote:
Op zaterdag 11 mei 2013 17:52 schreef Devv het volgende:
Zolang je geen IE8 gebruikt, is het wel cross-browser .

Hoezo? In IE8 werkt Google Fonts ook, hoor.

Verberg de nieuwsticker

zaterdag 11 mei 2013 @ 17:57:11 #94

Devv

quote:
Op zaterdag 11 mei 2013 17:55 schreef Tijn het volgende:

[..]

Hoezo? In IE8 werkt Google Fonts ook, hoor.

Dat mag dan een wonder heten.

zaterdag 11 mei 2013 @ 17:59:34 #95

Tijn

Powered by MS Paint

quote:
Op zaterdag 11 mei 2013 17:57 schreef Devv het volgende:

[..]

Dat mag dan een wonder heten.

Hoezo?

IE was juist een van de eerste browsers met ondersteuning van @font-face.

Verberg de nieuwsticker

zaterdag 11 mei 2013 @ 18:03:53 #96

Devv

quote:
Op zaterdag 11 mei 2013 17:59 schreef Tijn het volgende:

[..]

Hoezo?

IE was juist een van de eerste browsers met ondersteuning van @font-face.

Dat wist ik dus niet.

Ik vind IE8 over het algemeen gewoon niet echt ideaal om voor te ontwikkelen. Ik ben ook blij dat we op het werk hebben besloten om IE8 helemaal niet te ondersteunen.

zaterdag 11 mei 2013 @ 18:06:28 #97

Catch22-

Ben je Blind?!

Wat een kolder. Ie8 houdt zich over het algemeen prima aan de standaarden. Alleen geen css2.1 natuurlijk

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?

zaterdag 11 mei 2013 @ 18:15:58 #98

Maringo

Bèhèhèhèh

quote:
Op zaterdag 11 mei 2013 18:06 schreef Catch22- het volgende:
Wat een kolder. Ie8 houdt zich over het algemeen prima aan de standaarden. Alleen geen css2.1 natuurlijk

En de rest...

Die volg topic-knop hè...
Op 02-06-2014 16:38 schreef Moeraskat
Je bent te goed voor de mensheid.

zaterdag 11 mei 2013 @ 18:17:16 #99

Crimyclown

Sapper de fap!

Ik ben bezig met het oppakken van JS en in het boek staat het volgende voorbeeld:

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

//<![CDATA[
      //from antsArray.html

      var distractionList = new Array("", "suck his thumb", "tie his shoe");

      function chorus() {
        var text = "...and they all go marching down\n";
        text += "to the ground \n";
        text += "to get out \n";
        text += "of the rain. \n";
        text += " \n";
        text += "boom boom boom boom boom boom boom boom \n";
        return text;
      } // end chorus

      function verse(verseNum){
        //pull distraction from array
        var distraction = distractionList[verseNum];

        var text = "The ants go marching ";
        text += verseNum + " by " + verseNum + " hurrah, hurrah \n";
        text += "The ants go marching ";
        text += verseNum + " by " + verseNum + " hurrah, hurrah \n";
        text += "The ants go marching ";
        text += verseNum + " by " + verseNum;
        text += " the little one stops to ";
        text += distraction;
        return text;
      } // end verse1

      //main code is now a loop
      for (verseNum = 1; verseNum < distractionList.length; verseNum++){
        alert(verse(verseNum));
        alert(chorus());
      } // end for loop

      //]]>

Maar ik heb een vraagje over regel 32

1	for (verseNum = 1; verseNum < distractionList.length; verseNum++)

Waarom is dit niet

1	for (verseNum = 1; verseNum <= distractionList.length; verseNum++)

Of maakt het niet uit en kan het op beide manieren?

Anonieme tievesclown

zaterdag 11 mei 2013 @ 18:21:18 #100

Maringo

Bèhèhèhèh

quote:
Op zaterdag 11 mei 2013 14:46 schreef Devv het volgende:

[..]

Ik had het meer over het laden van web onderdelen . Maar dat is ook wel een handige tool.

Ah, verkeerd begrepen. Maar die tool zal ik ook es bekijken dan.

Die volg topic-knop hè...
Op 02-06-2014 16:38 schreef Moeraskat
Je bent te goed voor de mensheid.

zaterdag 11 mei 2013 @ 18:24:08 #101

Catch22-

Ben je Blind?!

Lomp voorbeeld. Normaal doe je een loop vanaf 0. Maar die is leeg in die array. Misschien om t makkelijker te maken, maar goed is het niet.

Als versenum gelijk zou mogen Zijn aan die length, zou hij tot 3 doortellen en die index bestaat niet

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?

zaterdag 11 mei 2013 @ 18:31:58 #102

Crimyclown

Sapper de fap!

Op die manier, had de 0 niet meegerekend. Bedankt

.

Anonieme tievesclown

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

» digital corner

» development

» digital corner

» development