Fixed header

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Senior Frontend developer

Wat wij bieden hybride werken,met als uitgangspunt 50% op kantoor en 50% vanuit huis; opleidingsmogelijkheden op basis van behoefte en ambitie; dus geen vast budget; flexibele werktijden en direct een contract voor onbepaalde tijd; 20 vakantiedagen en daarnaast 4,7% van je salaris om flexibel in te vullen, bijvoorbeeld goed voor 7 extra vakantiedagen; een mobiliteitsbudget dat aansluit bij jouw manier van reizen. Wat jij meeneemt een afgeronde technische hbo of wo opleiding; je bent een medior/senior frontend developer die zich wilt blijven ontwikkelen; expert in JavaScript, Angular, React of Vue. De uitdaging Als frontend developer bij Ordina JSRoots ontwerp en

Bekijk vacature »

Senior developer (Almelo en thuis)

Functie­omschrijving Ben jij degene die de Justitiële organisaties verder helpt naar een volledig digitale en transparante informatiehuishouding? Wil jij jouw kennis van data gedreven werken, AI en containerisatie hiervoor inzetten? Lees dan verder. Wat ga je doen? We zoeken een senior developer die onze dienstverlening op het gebied van digitaal archiveren en intelligent metadateren verder brengt. Dit doe je door de scrumteams door jouw enthousiasme en drang naar innovatie verder te coachen en herin te ontwikkelen. . Het gaat om miljoenen records, complexe ketens, uitdagende maatschappijkritische applicaties op het gebied van het bewaren en uitwisselen van digitale dossiers en documenten

Bekijk vacature »

Freelance senior Programmeur (zzp)

Dienst Uitvoering Onderwijs Uren per week: 36,00 Standplaats: Groningen Max tarief: € 90,00 Startdatum inzet: 2-1-2023 Einddatum inzet: 1-1-2024 Wat doen we voor werk momenteel? Nieuwe applicaties: We bouwen nieuwe applicaties voor inwinnen B3/B4 scholen. Deze scholen kunnen inschrijvingen via een website aanleveren per keer of meerdere inschrijvingen via bestand. Deze inschrijvingen leggen we vast en ze kunnen ook beheerd worden. Moderniseren: Daarnaast hebben we zoals alle andere teams ook een flinke migratie voor de boeg om in de Cloud te landen. Eén applicatie (AVOID) hebben we al succesvol gemigreerd en deze draait bijna in PRD. De grootste uitdaging voor

Bekijk vacature »

Java Developer FlightInfo

De functie Organization We are an aviation company with an important social mission. With our airports, we create value for society and the economy. If you come on board at Royal Schiphol Group, you will enter a world that is always on the move. Your development also determines our development. We offer you all the space you need to keep moving and invest in your development and health. We base this on your own talents and qualities, because we urgently need them to achieve our ambitions: to become and remain Europe's Preferred Airport and a zero-waste airport in 2030! The

Bekijk vacature »

Python Software Developer

Do you have a deep interest in technology and are you able to understand and improve the world around it? Do you want to contribute to the development of innovative software solutions within the high-tech industry? Then join our Technical Applications team and participate in complex projects for the High-tech make industry! Lianne Snellenburg, Team Manager Technical Applications: " I’m looking for a technically oriented Software Engineer with a strong focus on development in Python (2.7 and 3.8). As a Software Engineer in the TA team you work with the total end product in mind. You consult and work closely

Bekijk vacature »

PHP Developer

Als PHP Developer bij Coolblue zorg je ervoor dat onze webshops elke dag een beetje beter zijn. Wat doe je als PHP Developer bij Coolblue? Als PHP Developer werk je met andere development teams samen om onze webshop zo optimaal mogelijk te laten werken en onze klanten blij te maken. Hoewel je een PHP Developer bent, sta je open om C# of Typescript in te zetten of te leren. Ook PHP Developer worden bij Coolblue? Lees hieronder of het bij je past. Dit vind je leuk om te doen pure PHP code schrijven. Samenwerken met de klantreiziger om onze klanten

Bekijk vacature »

.Net Developer

Samengevat: Wij ontwikkelen innovatieve software voor woningcorporaties. Wil jij onze applicaties verbeteren? Heb jij ervaring met software ontwikkeling? Vaste baan: .NET Developer Features IT 2.700 - 4.700 .NET Developer front end (javascript / Angular) Deze werkgever is een kleinschalig softwarebedrijf, waarin ontwikkelaars en adviseurs samenwerken om innovatieve software voor woningcorporaties te ontwikkelen. Zij richten zich op applicaties voor Vastgoedinformatie en Vastgoedsturing. Zij richten zich op woningcorporaties in heel Nederland. Zij werken in een open, informele en collegiale sfeer. Je krijgt de ruimte om je continue te ontwikkelen. Zij werken voor MKB klanten. Deze werkgever heeft veel verschillende projecten. Hou jij

Bekijk vacature »

Freelance senior ICT ontwikkelaar (zzp)

Belastingdienst B/cao Startdatum inzet: 9-1-2023 Einddatum inzet: 31-12-2023 Uren per week: 36,00 Standplaats: Apeldoorn Max tarief: € 86,00 Team LIV is op zoek naar een enthousiaste, flexibele, multitaskende en hands-on ontwikkelaar met veel ervaring in het gedeeltelijk of volledig zelfstandig bepalen van ontwikkel- en realisatie aanpak. Onze nieuwe collega moet in staat zijn te werken in een hectische omgeving waarbij er sprake is van zeer verschillen realisatietrajecten voor wat betreft(technische)diepgang, startmoment (wel/geen beschrijvingen beschikbaar) en klantcontact. De gekozen ontwikkelmethodiek dient passend te zijn voor het op te lossen vraagstuk waarbij samenwerking met de testengineer in relatie tot Systeem integratie test

Bekijk vacature »

Projectdeveloper circulariteit en duurzaamheid

Ben jij die netwerker en verbinder die opgaves voor duurzaamheid en circulariteit weet te vertalen naar resultaatgerichte programma's en projecten, in nauwe samenwerking met overheden, ondernemers en kennisinstellingen? Herken jij signalen uit de markt en weet je partijen hiervoor aan elkaar te verbinden die de ambities waarmaken? Heb jij een ondernemende mentaliteit en wil je werken aan het verhogen van het Bruto Twents Geluk? Dan zoekt de Twente Board jou! Functie omschrijving Wil jij werken aan dé economisch en maatschappelijk relevante thema's voor Twente? Wil jij organisaties en mensen binnen en buiten de regio met elkaar verbinden? Dat is namelijk

Bekijk vacature »

C# Software Developer

Samengevat: Deze werkgever is een IT bedrijf. Wil jij betrokken zijn bij de ontwikkeling van onze producten en diensten? Heb jij ervaring als software developer? Vaste baan: C# Software Developer Java HTML WO 3.100 - 4.100 Software Developer Deze werkgever is sterk in het op maat inzetten en beheren van ERP-systemen, met name SAP. Deze werkgever levert aan middelgrote ondernemingen een totaal oplossing. Ook zijn zij actief op het gebied van de ontwikkeling van webapplicaties, webshops en portals. Bij bij hun werk je aan onze eigen bedrijfsapplicaties. Je ontwikkelt met ons de meest nieuwe software. Wij blinken uit als het

Bekijk vacature »

Freelance senior ICT ontwikkelaar (zzp)

Belastingdienst B/cao Startdatum inzet: 9-1-2023 Einddatum inzet: 31-12-2023 Uren per week: 36,00 Standplaats: Apeldoorn Max tarief: € 86,00 Team LIV is op zoek naar een enthousiaste, flexibele, multitaskende en hands-on ontwikkelaar met veel ervaring in het gedeeltelijk of volledig zelfstandig bepalen van ontwikkel- en realisatie aanpak. Onze nieuwe collega moet in staat zijn te werken in een hectische omgeving waarbij er sprake is van zeer verschillen realisatietrajecten voor wat betreft(technische)diepgang, startmoment (wel/geen beschrijvingen beschikbaar) en klantcontact. De gekozen ontwikkelmethodiek dient passend te zijn voor het op te lossen vraagstuk waarbij samenwerking met de testengineer in relatie tot Systeem integratie test

Bekijk vacature »

Medior .NET Ontwikkelaar

In het kort Als .NET ontwikkelaar ga je binnen onze business unit Transport en Logistiek aan de slag complexe maatwerk software voor bedrijf kritische systemen binnen de technische automatisering. Denk bijvoorbeeld een IoT-oplossing voor de logistieke sector waarbij we van ruim 200.000 machines de telemetrie en events verwerken. We zijn actief in de distributielogistiek, havenlogistiek en productielogistiek. Naast C# en .NET Core maken we ook gebruik van Azure technologie. En als trotse Microsoft Gold Partner leren we graag van en met jou. Wil jij jezelf blijven ontwikkelen binnen de technische automatisering met .NET, dan gaan we deze uitdaging graag met

Bekijk vacature »

Mendix - Front-end Software Developer

Wat wij bieden een contract voor onbepaalde tijd en goede primaire arbeidsvoorwaarden; een flexibele werkomgeving waar je tijd en plaats onafhankelijk kan werken; een ruim mobiliteitsbudget voor een keuze in een leaseauto of voor je eigen vervoer; een flex benefit budget en collectieve regelingen (o.a. thuiswerkfaciliteiten, korting op je zorgverzekering en bedrijfsfitness); een keuze in een laptop en je ontvangt een telefoonvoucher t.w.v. €290,-; een betrokken community dat gericht is op jouw interesses, teambuilding, gaming en evenementen; onbeperkt opleidingsbudget om je technisch en persoonlijk te blijven ontwikkelen. Wat jij meeneemt je hebt een (technische) HBO of WO-diploma behaald; je bent

Bekijk vacature »

Senior Front-end Developer

Wordt jij de nieuwe Front end specialist / developer? Dan werk je dagelijks met collega’s aan de mooiste IT-projecten. Sogeti is een organisatie met een goede werksfeer en zo min mogelijk hiërarchische verhoudingen. Deze snelgroeiende groep collega’s krijgt energie van hun vak en dat merk je op de werkvloer. Onze klantenkring is groot en divers, dat vraagt om flexibiliteit van jou. Tegelijkertijd betekent dit dagelijks nieuwe dingen leren én dat geen werkdag hetzelfde is. Natuurlijk krijg jij de mogelijkheid je te certificeren. We organiseren regelmatig technische Meet-ups en doen we veel aan kennisdeling waarbij iedereen welkom is, zowel binnen als

Bekijk vacature »

Freelance senior ICT ontwikkelaar (zzp)

Belastingdienst B/cao Startdatum inzet: 9-1-2023 Einddatum inzet: 31-12-2023 Uren per week: 36,00 Standplaats: Apeldoorn Max tarief: € 86,00 Team LIV is op zoek naar een enthousiaste, flexibele, multitaskende en hands-on ontwikkelaar met veel ervaring in het gedeeltelijk of volledig zelfstandig bepalen van ontwikkel- en realisatie aanpak. Onze nieuwe collega moet in staat zijn te werken in een hectische omgeving waarbij er sprake is van zeer verschillen realisatietrajecten voor wat betreft(technische)diepgang, startmoment (wel/geen beschrijvingen beschikbaar) en klantcontact. De gekozen ontwikkelmethodiek dient passend te zijn voor het op te lossen vraagstuk waarbij samenwerking met de testengineer in relatie tot Systeem integratie test

Bekijk vacature »
Veur Heur

Veur Heur

08/06/2015 22:38:12
Quote Anchor link
Iemand enig idee waarmee deze headerdeze header wordt vastgezet na scrollen? In de broncode kan ik het niet vinden. De oplossing die ik nu gebruik (scrolltofixed) werkt wel, maar er zit een vertraging in waardoor het menu verdwijnt en daarna pas gefixed terug komt. Zie wel iets van position:sticky staan, maar dat lijkt niet te werken, dit fixed namelijk meteen m'n menu en dat is natuurlijk niet de bedoeling.

Waar kijk ik over heen?
 
PHP hulp

PHP hulp

04/02/2023 07:19:11
 
Johan K

Johan K

08/06/2015 23:17:27
Quote Anchor link
Tja, ik keen dit in Chrome en ik begreep niet echt wat je bedoelde. Opende hem in Firefox na aanleiding van deze website:
http://caniuse.com/#feat=css-sticky
En toen werkte het. Dus dit word alleen ondersteund in Firefox, Safari en Opera.

Ik ben bang dat er geen andere uitweg is om jQuery hiervoor te gebruiken als je browser compatibility wil, maar dan krijg je inderdaad die vertraging.

Als je dat niets uitmaakt, zou je even kunnen kijken naar:
https://developer.apple.com/assets/scripts/global.js -> $(window).scroll(function() {

Het zou een combinatie kunnen zijn met jQuery & position: sticky.
 
Thomas van den Heuvel

Thomas van den Heuvel

08/06/2015 23:53:03
Quote Anchor link
Hoeft niet eens met sticky position, je kunt position: fixed gebruiken via een class die je toegvoegt/verwijdert afhankelijk van de scrollTop. Dat is een wat meer "pure" css/js oplossing die niet afhangt van position: sticky.
 
Veur Heur

Veur Heur

09/06/2015 10:55:10
Quote Anchor link
Probleem met scrollTop lijkt dus dat wanneer de header gefixed zou moeten worden, deze toch nog even door gaat om vervolgens weer (gefixed) terug te komen. Dit is althans het geval in Safari, in Firefox etc werkt het prima. Zou het echter ook graag goed zien werken op een iPad.
 
Thomas van den Heuvel

Thomas van den Heuvel

09/06/2015 13:54:42
Quote Anchor link
Dat ligt dan toch aan je CSS, dit lijkt prima te werken:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
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
55
56
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>sticky navigation</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <style type="text/css">
        <!--
        html                    { height: 100%; margin: 0; padding: 0; }
        body                    { height: 100%; margin: 0; padding: 0; }
        div.wrapper             { margin: 0 auto; width: 850px; min-height: 100%; position: relative; background-color: #f0f0ff; }
        div.header              { width: 850px; height: 100px; background-color: #ffd0d0; }
        div.nav-wrapper         { min-height: 50px; } /* voor het tegengaan van het verspringen van #navigation */
        div.navbox-1            { width: 850px; height: 25px; line-height: 25px; background-color: #d0ffd0; }
        div.navbox-2            { width: 850px; height: 25px; line-height: 25px; background-color: #b0ffb0; }
        div#navigation.sticky   { position: fixed; top: 0; z-index: 1; }
        //-->
    </style>
</head>

<body>
<div class="wrapper">
    <div class="header">
    </div>
    <div class="nav-wrapper">
        <div id="navigation">
            <div class="navbox-1">link 1 - link 2 - link 3</div>
            <div class="navbox-2">link 4 - link 5 - link 6</div>
        </div>
    </div>
    <div class="main">
        content<br />content<br />content<br />content<br />content<br />content<br />content<br />content<br />content<br />content<br />
        content<br />content<br />content<br />content<br />content<br />
        content<br />content<br />content<br />content<br />content<br />content<br />content<br />content<br />content<br />content<br />
        content<br />content<br />content<br />content<br />content<br />content<br />content<br />content<br />content<br />content<br />
        content<br />content<br />content<br />content<br />content<br />content<br />content<br />content<br />content<br />content<br />
        content<br />content<br />content<br />content<br />content<br />content<br />content<br />content<br />content<br />content<br />
        content<br />content<br />content<br />content<br />content<br />content<br />content<br />content<br />content<br />content<br />
        content<br />content<br />content<br />content<br />content<br />
    </div>
</div>
<script type="text/javascript">
    //<![CDATA[
    $(document).ready(function() {
        $(document).scroll(function(e) {
            if ($(document).scrollTop() > 100) {
                $('div#navigation').addClass('sticky');
            } else {
                $('div#navigation').removeClass('sticky');
            }
        });
    });
    //]]>
</script>
</body>
</html>
Gewijzigd op 09/06/2015 13:55:01 door Thomas van den Heuvel
 
Veur Heur

Veur Heur

09/06/2015 17:36:25
Quote Anchor link
Das vreemd, dit voorbeeld werkt inderdaad als een trein. Zal het eens toe gaan passen op mijn project.
 
Thomas van den Heuvel

Thomas van den Heuvel

09/06/2015 22:42:48
Quote Anchor link
Oh, dat komt waarschijnlijk omdat op het moment dat je elementen "fixed" positioneert, je deze uit de "flow" van de rest van de pagina haalt, daardoor kunnen er dingen verspringen, omdat het element wat "fixed" is geworden op die plek geen ruimte meer inneemt.

Vandaar ook die div.nav-wrapper in het bovenstaande stuk code, zie ook de toelichting in CSS: /* voor het tegengaan van het verspringen van #navigation */

Laat die div maar eens weg, dan verspringt er dus wel het een en ander als je gaat scrollen.
Gewijzigd op 09/06/2015 22:43:33 door Thomas van den Heuvel
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.