[html, css, js] voor dummies #22

Index

» digital corner

» development

actieve topics nieuwe topics
abonnement Unibet Coolblue
pi_108265450
quote:
14s.gif Op woensdag 22 februari 2012 15:40 schreef KomtTijd... het volgende:
Gebruik anders even een normale host of werk gewoon offline, die tumblr voegt allemaal rotzooi toe.
Tja, maar de site moet uiteindelijk wel op Tumblr draaien, een deel van de rotzooi heb ik dus wel nodig..

Edit: nu ik goed kijk en logisch nadenk: tussen al die andere hoezen zit ook steeds zo'n 5px in, dus hij zal ws die ruimte nu op een of andere manier in de div knallen.. alleen vaag dat ik dit in het css file niet terug kan vinden.
Don't let your shadow spoil the view of what's around you
pi_108265716
Welke browser gebruik je? Heb je de cache geleegd van die browser? Waar zeggen de development tools dat die ruimte vandaan komt?
zcflevo.nl
pi_108265867
quote:
14s.gif Op woensdag 22 februari 2012 15:48 schreef KomtTijd... het volgende:
Welke browser gebruik je? Heb je de cache geleegd van die browser? Waar zeggen de development tools dat die ruimte vandaan komt?
Firefox 10.0.2 , cache zojuist geleegd, wat betreft de development tools... geen idee hoe ik dat uitzoek.. ik zie dat er wel een rood frame verschijnt ongeveer rondom die ruimte, maar er verschijnt geen specificatie wat het dan is?
Don't let your shadow spoil the view of what's around you
  woensdag 22 februari 2012 @ 15:53:00 #79
87680 Mirel
Mirel wil een bongophone.
pi_108265905
YESSSSSSS 10 nieuwe posts.

oh ;(
When all else fails, you always have delusion.
pi_108265911
Installeer even firebug.
Daarna F12, blauwe pijltje en klikken op het gedeelte wat niet klopt.
zcflevo.nl
pi_108266159
quote:
0s.gif Op woensdag 22 februari 2012 15:53 schreef Mirel het volgende:
YESSSSSSS 10 nieuwe posts.

oh ;(

Dit wat je zoekt?
zcflevo.nl
  PR/Manusje van alles woensdag 22 februari 2012 @ 16:04:10 #82
148800 crew  Surveillance-Fiets
Toezicht is gezond!
pi_108266345
Dit is een deel van de phpcode van een image slider. Normaal slide hij van links naar rechts. Nu slide hij helemaal niet meer. Is mijn bedoeling. En nu moet hij fade out / fade in doen als hij van slide 1 naar 2 enz gaat.

Jullie enig idee welke ik precies aan zou kunnen passen als het in dit stukje staat? :P

1
2
3		<?php
a.fn.slides.option={preload:!1,preloadImage:"/img/loading.gif",container:"slides_container",generateNextPrev:!1,next:"next",prev:"prev",pagination:!0,generatePagination:!0,prependPagination:!1,paginationClass:"pagination",currentClass:"current",fadeSpeed:10,fadeEasing:"",slideSpeed:1,slideEasing:"",start:1,effect:"slide",crossfade:!1,randomize:!1,play:1,pause:0,hoverPause:!1,autoHeight:!1,autoHeightSpeed:350,bigTarget:!1,animationStart:function(){},animationComplete:function(){},slidesLoaded:function(){}},a.fn.randomize=function(b){function c(){return Math.round(Math.random())-.5}return a(this).each(function(){var d=a(this),e=d.children(),f=e.length;if(f>1){e.hide();var g=[];for(i=0;i<f;i++)g[g.length]=i;g=g.sort(c),a.each(g,function(a,c){var f=e.eq(c),g=f.clone(!0);g.show().appendTo(d),b!==undefined&&b(f,g),f.remove()})}})}})(jQuery)
?>
Ik denk meer dat je als nieuwsposter een geile egocentrische narcist moet zijn, die een flinke stijve krijgt van alle berichten die ie van zijn eigen hand ziet op de FP, zo! ©yvonne
Beste nieuwsbericht ooit op de FOK!frontpage!
pi_108266378
Hmm, Firebug lijkt ook niks te vinden. Althans.. het pijltje selecteert gewoon de afbeelding, en zowel in html als css staat echt niets wat naar een margin of witregel lijkt te wijzen.. Bah frustrerend, het moet toch ergens vandaan komen?

Overigens, met betrekking tot wat ik oorspronkelijk wilde:



Als ik een box uit losse elementen opbouw is het zeg maar onmogelijk om de inhoud van de box over de zwarte lijnen heen te laten vallen, met als gevolg dat het kader soms dikker is dan ik zou willen.
Don't let your shadow spoil the view of what's around you
pi_108266494
quote:
0s.gif Op woensdag 22 februari 2012 16:04 schreef Surveillance-Fiets het volgende:
Dit is een deel van de phpcode van een image slider. Normaal slide hij van links naar rechts. Nu slide hij helemaal niet meer. Is mijn bedoeling. En nu moet hij fade out / fade in doen als hij van slide 1 naar 2 enz gaat.

Jullie enig idee welke ik precies aan zou kunnen passen als het in dit stukje staat? :P
[ code verwijderd ]

Das geen PHP maar Javascript, jQuery om precies te zijn. Watvoor slider is het? Is er documentatie van?
zcflevo.nl
  PR/Manusje van alles woensdag 22 februari 2012 @ 16:09:25 #85
148800 crew  Surveillance-Fiets
Toezicht is gezond!
pi_108266584
quote:
14s.gif Op woensdag 22 februari 2012 16:07 schreef KomtTijd... het volgende:

[..]

Das geen PHP maar Javascript, jQuery om precies te zijn. Watvoor slider is het? Is er documentatie van?
ojaduhh

was in de war door het fokicoontje om code te posten. _O- _O-

eem kiekn wak allemaal heb.
Ik denk meer dat je als nieuwsposter een geile egocentrische narcist moet zijn, die een flinke stijve krijgt van alle berichten die ie van zijn eigen hand ziet op de FP, zo! ©yvonne
Beste nieuwsbericht ooit op de FOK!frontpage!
pi_108266601
quote:
0s.gif Op woensdag 22 februari 2012 16:04 schreef Maartel het volgende:
Hmm, Firebug lijkt ook niks te vinden. Althans.. het pijltje selecteert gewoon de afbeelding, en zowel in html als css staat echt niets wat naar een margin of witregel lijkt te wijzen.. Bah frustrerend, het moet toch ergens vandaan komen?

Ik snap nog steeds niet hoe jij aan witruimte komt wat die is er bij mij echt niet.
quote:
Overigens, met betrekking tot wat ik oorspronkelijk wilde:

[ afbeelding ]

Als ik een box uit losse elementen opbouw is het zeg maar onmogelijk om de inhoud van de box over de zwarte lijnen heen te laten vallen, met als gevolg dat het kader soms dikker is dan ik zou willen.
Eh, nee. Je kunt gewoon negatieve margins e.d. gebruiken. Of position:relative. Maar ik snap nog steeds niet wat nou je probleem is.
zcflevo.nl
pi_108266724
quote:
14s.gif [b]Op [url=http://forum.fok.nl/topic/1780321
Eh, nee. Je kunt gewoon negatieve margins e.d. gebruiken. Of position:relative. Maar ik snap nog steeds niet wat nou je probleem is.
Nou, mijn probleem lag bij die audioplayer in die zwarte box. De achtergrond loopt enkele pixels te ver door, en wanneer ik negatieve margins gebruik wordt de 'onderkant' van de box wel omhooggetrokken, maar dan loopt de achtergrond er nog steeds dwars door heen omdat die tot het einde van de player door blijft lopen, dus in die zin valt de box niet naar eigen smaak te resizen, lijkt het?

Ik weet nu niet echt meer welk deel van mijn probleem lost in translation geraakt :{

Moet ik misschien de box niet als een div om een afbeelding/object heenzetten maar gewoon los plaatsen en vervolgens de afbeelding ervoor zetten?

[ Bericht 9% gewijzigd door Maartel op 22-02-2012 16:22:45 ]
Don't let your shadow spoil the view of what's around you
pi_108267222
waarom moet er uberhaupt een div om je afbeelding heen?
zcflevo.nl
pi_108267235
quote:
14s.gif Op woensdag 22 februari 2012 16:26 schreef KomtTijd... het volgende:
waarom moet er uberhaupt een div om je afbeelding heen?
Zodat het achtergrond image zich blijft herhalen?

Edit: Oh, ik kan in t geval van een object of img natuurlijk ook gelijk 'class=...' aan t object zelf toevoegen :@
Don't let your shadow spoil the view of what's around you
pi_108268639
Ook maar even laten weten als er iets wel lukt: die overbodige ruimte was op te lossen door een 'line-height:0px' aan de css toe te voegen.
Don't let your shadow spoil the view of what's around you
pi_108269640
Nog een vraag.

Ik heb een paar linkjes, en rechts van de link staat een pijl.
Hierom probeerde ik eerst mijn a's 200px breed te maken, de pijl een achtergrondafbeelding te maken en de achtergrondafbeelding rechts te positioneren.
Het werkt alleen niet. De pijlen zitten achter het einde van de a's, en niet 200px verderop.

Tips?
1
2
3
4
5
6
7
8
9
10
11
12		.footer a{
    color:#d2d3d3;
    font-size:15px;
    line-height:27px;
    font-family:Myriad Pro, Verdana;
    font-weight:100;

    width:200px;
    background-repeat:no-repeat;
    background-image:url(img/pijl.png);
    background-position:right;
}
  woensdag 22 februari 2012 @ 19:38:32 #92
56176 Catch22-
Ben je Blind?!
pi_108274497
je a moet display block hebben. inline elementen kan je geen breedte geven. ik zou trouwens 180px met 20px padding rechts doen icm display block, dan valt een lange tekst niet over je plaatje (tenzij die breder dan 20px is).
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_108276247
quote:
11s.gif Op woensdag 22 februari 2012 19:38 schreef Catch22- het volgende:
je a moet display block hebben. inline elementen kan je geen breedte geven. ik zou trouwens 180px met 20px padding rechts doen icm display block, dan valt een lange tekst niet over je plaatje (tenzij die breder dan 20px is).
Yusss, werkt! O+
Oh, dat is geen probleem denk ik :o De teksten zijn niet lang, de langste is 15 karakters, en de breedte wordt ongeveer 250 :D Ik ga het wel onthouden, just in case, dankjewel!
pi_108283464
Ben ik weer.
Het gaat altijd mis als ik met menu's begin. Ik had een search gemaakt, die deed het goed, stond op zijn plek, etc.

Vervolgens probeer ik mijn menu erin te zetten. Omdat 3 menu-items links zitten en 2 rechts, dacht ik dat ik de twee rechter een eigen class mee zou geven met een float right. Ook aan mijn search heb ik die gegeven. Vervolgens wordt de search omlaag gedrukt.

Ik denk ook dat ik het helemaal verkeerd aanpak, maar ik weet niet hoe ik het anders aan moet pakken.

Enig idee?



1
2
3
4
5
6
7
8
9
10
11
12
13
14		Menu in HTML: 
<ul class="menu_linkerdeel">
                <li><a href="#">Home</a></li>
                <li><a href="#">Recepten</a></li>
                <li><a href="#">Recepten inzenden</a></li>
                <li class="menu_rechterdeel"><a href="#">Tips & Tricks</a></li>
                <li class="menu_rechterdeel"><a href="#">Contact</a></li>
            </ul>

            <div class="lighter">
                <form>
                    <span><input type="text" class="search rounded" placeholder="Search..."></span>
                </form>
            </div>
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		Menu in CSS
#menu{
    width:980px;
    height:3px;
    margin:0 auto;
}

#menu ul li{
    display:inline-block;
}

.menu_linkerdeel{
    float:left;
}
.menu_rechterdeel{
    float:right;
}

/*************** Zoekformulier ****************/

.search {
    padding:3px 25px 3px 10px;
    margin-top:5px;
    margin-left:880px;
    background:url(img/zoek_vergrootglas.png) no-repeat 8px 6px;
    background-position:right;
    width:100px;
    background-color:#e28271;
    border-top:1px solid #8e665e;
    border-bottom:1px solid #f0beb5;
    border-left:1px solid #cd877a;
    border-right:1px solid #cd877a;
    float:right;
}
.rounded{
        border-radius:15px;
    -moz-border-radius:15px;
    -webkit-border-radius:15px;
}

input[type=text]{
    color:#540e02;
}
  woensdag 22 februari 2012 @ 22:30:37 #95
134533 donroyco
dus niet Donroyco
pi_108283663
quote:
0s.gif Op woensdag 22 februari 2012 22:27 schreef RenRen- het volgende:
Ben ik weer.
Het gaat altijd mis als ik met menu's begin. Ik had een search gemaakt, die deed het goed, stond op zijn plek, etc.

Vervolgens probeer ik mijn menu erin te zetten. Omdat 3 menu-items links zitten en 2 rechts, dacht ik dat ik de twee rechter een eigen class mee zou geven met een float right. Ook aan mijn search heb ik die gegeven. Vervolgens wordt de search omlaag gedrukt.

Ik denk ook dat ik het helemaal verkeerd aanpak, maar ik weet niet hoe ik het anders aan moet pakken.

Enig idee?

[ afbeelding ]
[ code verwijderd ]

[ code verwijderd ]

Je probeert een list-item rechts te laten floaten, terwijl het al binnen een element staat dat naar links float, en dat kan niet.
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. :'(
pi_108284006
quote:
0s.gif Op woensdag 22 februari 2012 22:30 schreef donroyco het volgende:

[..]

Je probeert een list-item rechts te laten floaten, terwijl het al binnen een element staat dat naar links float, en dat kan niet.
Klinkt logisch. Maar hoe moet ik het dan oplossen? de li's die links moeten floaten de class links geven?
Want ook de volgorde van de menu-items wordt hierdoor aangepast.

Edit; geprobeerd, volgorde van de menu-items is nogsteeds raar en de search wordt nog omlaag gedrukt

[ Bericht 7% gewijzigd door RenRen- op 22-02-2012 22:42:51 ]
  woensdag 22 februari 2012 @ 22:49:18 #97
134533 donroyco
dus niet Donroyco
pi_108284557
quote:
0s.gif Op woensdag 22 februari 2012 22:37 schreef RenRen- het volgende:

[..]

Klinkt logisch. Maar hoe moet ik het dan oplossen? de li's die links moeten floaten de class links geven?
Want ook de volgorde van de menu-items wordt hierdoor aangepast.

Edit; geprobeerd, volgorde van de menu-items is nogsteeds raar en de search wordt nog omlaag gedrukt
Omdat je rechts float met de search, moet je die bovenaan zetten, nog voor het menu. Daarnaast zou ik het één-na-laatste menu-item een margin-left meegeven zodat die rechts ernaast valt.
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. :'(
pi_108284937
quote:
0s.gif Op woensdag 22 februari 2012 22:49 schreef donroyco het volgende:

[..]

Omdat je rechts float met de search, moet je die bovenaan zetten, nog voor het menu. Daarnaast zou ik het één-na-laatste menu-item een margin-left meegeven zodat die rechts ernaast valt.
Door de search erboven te zetten knalt het hele menu een stuk omlaag. Irritant dit. ;( Ook geprobeerd om de ul een breedte mee te geven, werkt ook niet.
Bedankt wel dat je probeert te helpen :Y
  woensdag 22 februari 2012 @ 23:01:02 #99
134533 donroyco
dus niet Donroyco
pi_108285179
quote:
0s.gif Op woensdag 22 februari 2012 22:56 schreef RenRen- het volgende:

[..]

Door de search erboven te zetten knalt het hele menu een stuk omlaag. Irritant dit. ;( Ook geprobeerd om de ul een breedte mee te geven, werkt ook niet.
Bedankt wel dat je probeert te helpen :Y
Waarom geef je je menu trouwens een hoogte mee van 3px?
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. :'(
  woensdag 22 februari 2012 @ 23:05:24 #100
56176 Catch22-
Ben je Blind?!
pi_108285395
om zulke dingen te voorkomen positioneer ik met containers. zet je menu in een div en die zoektool in een div. breedtes geven en floaten en je bent er af
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?
actieve topics nieuwe topics
abonnement Unibet Coolblue
[html, css, js] voor dummies #22
Index

» digital corner

» development

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