File: D:/HostingSpaces/SBogers10/rooymans.komma-mediadesign.nl/wwwroot/over_ons_pop_up.php
<?php
include("all_kms_con.inc.php");
?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Medewerkers | Rooymans Neckwear</title>
<link type="text/css" rel="stylesheet" href="https://fast.fonts.com/cssapi/b5c58856-354e-4abf-9798-a44c526dedec.css"/>
</head>
<body>
<div id="popUpFrame" class="disableSelection">
<div class="fotoFrame">
<ul>
<li class="first">
<div class="tekstPersoon">
<h1>
Patriek Rooymans
</h1>
<h2>
Managing Director<br />Sales Manager
</h2>
<p class="emailadres"><a href="mailto:patriek@rooymansneckwear.nl">patriek@rooymansneckwear.nl</a></p>
<p>
Patriek staat samen met zijn zus Pasquale aan het roer van Rooymans Neckwear. Patriek is een echte doener, een harde werker die geen uitdaging uit de weg gaat. Een brok aan ervaring maakt hem een bekwame manager. Het bewaken van de dagelijkse gang van zaken behoort tot een van zijn vele taken. Zijn doelgerichte manier van werken, maakt hem bij veel klanten geliefd.
</p>
</div>
<img src="/img/over_ons/patriek.jpg" />
</li>
<li>
<div class="tekstPersoon">
<h1>
Pasquale Rooymans
</h1>
<h2>
Managing Director<br />Art director
</h2>
<p class="emailadres"><a href="mailto:cal@rooymansneckwear.nl">cal@rooymansneckwear.nl</a></p>
<p>
Pasquale leidt, samen haar broer Patriek, Rooymans Neckwear. Pasquale is een energiek en artistiek persoon, verantwoordelijk voor de creatieve input. Ze staat aan het hoofd van de ontwerpafdeling en is verantwoordelijk voor het ontwikkelen en realiseren van nieuwe en innoverende ideeën. Ook ontwerpt en beheert ze de collecties van onder andere MC Escher en de collecties van museumshops, bijvoorbeeld het Van Gogh Museum.
</p>
</div>
<img src="/img/over_ons/pasquale.jpg" />
</li>
<li>
<div class="tekstPersoon">
<h1>
Joep Rooymans
</h1>
<h2>
Senior Sales Advisor
</h2>
<p class="emailadres"><a href="mailto:sales@rooymansneckwear.nl">sales@rooymansneckwear.nl</a></p>
<p>
Joep is de <em>founding father</em> van Rooymans Neckwear. Hij houdt zich tegenwoordig bezig met een aantal salestaken. Daarnaast is hij een zeer gewaardeerd adviseur.
</p>
</div>
<img src="/img/over_ons/joep.jpg" />
</li>
<li>
<div class="tekstPersoon">
<h1>
Nathalie Humbert
</h1>
<h2>
Account Manager (Sales)
</h2>
<p class="emailadres"><a href="mailto:nathalie@rooymansneckwear.nl">nathalie@rooymansneckwear.nl</a></p>
<p>
Nathalie is verantwoordelijk voor de verkoop van custom made stropdassen en sjaals. Zij onderhoudt de contacten met klanten van Rooymans Neckwear. Daarnaast ontwikkelt en coördineert ze doelgerichte marketingacties. Ze speelt dus een belangrijke rol in profileren en positioneren van de organisatie.
</p>
</div>
<img src="/img/over_ons/nathalie.jpg" />
</li>
<li>
<div class="tekstPersoon">
<h1>
Kim van de Moosdijk
</h1>
<h2>
Webmaster<br />Designer
</h2>
<p class="emailadres"><a href="mailto:kim@rooymansneckwear.nl">kim@rooymansneckwear.nl</a></p>
<p>
Kim zorgt voor de websites van Rooymans Neckwear. Ze zorgt ervoor dat alles werkt, up-to-date is en houdt de supervisie over de backoffice van de online communicatie. Ook is ze een van de designers van de custom made stropdassen en sjaals. Zo verrast ze onze klanten vaak met haar eigentijdse ontwerpen. Kim is een spil in het bedrijf en met haar vele trouwe dienstjaren een echte stropdassenkenner én duizendpoot.
</p>
</div>
<img src="/img/over_ons/kim.jpg" />
</li>
<li>
<div class="tekstPersoon">
<h1>
Maartje Sak
</h1>
<h2>
Designer
</h2>
<p class="emailadres"><a href="mailto:maartje@rooymansneckwear.nl">maartje@rooymansneckwear.nl</a></p>
<p>
Maartje kan als geen ander een logo vertalen naar een stropdassenontwerp. Zij komt vaak verrassend uit de hoek met haar prachtige en doordachte ontwerpen. Als designer is Maartje een creatieveling met pit.
</p>
</div>
<img src="/img/over_ons/maartje.jpg" />
</li>
<li>
<div class="tekstPersoon">
<h1>
Ella Schellekens
</h1>
<h2>
Sales<br />Office Support
</h2>
<p class="emailadres"><a href="mailto:ella@rooymansneckwear.nl">ella@rooymansneckwear.nl</a></p>
<p>
Ella is de multitasker van het bedrijf. Ze is verantwoordelijk voor alle binnenkomende bestellingen en de inkooptaken van de voorraadcollectie. Ze draagt zorg voor de administratieve afwikkeling van orders en houdt de planning en de status van alle lopende zaken bij. Ook klantcontact behoort tot haar taken en gaat haar goed af: van haar nauwkeurigheid en klantvriendelijkheid zijn veel klanten erg gecharmeerd.
</p>
</div>
<img src="/img/over_ons/ella.jpg" />
</li>
<li>
<div class="tekstPersoon">
<h1>
Mirjam van Hunsel
</h1>
<h2>
Administration
</h2>
<p class="emailadres"><a href="mailto:mirjam@rooymansneckwear.nl">mirjam@rooymansneckwear.nl</a></p>
<p>
Mirjam houdt zich bezig met de administratieve taken binnen het bedrijf, van facturering tot het beheren van de boekhouding. Ook is Mirjam verantwoordelijk voor de planning van alle lucht- en scheepsvrachten van al onze uit te leveren stropdassen en sjaals. Overzicht behouden is dan ook een van haar sterke punten.
</p>
</div>
<img src="/img/over_ons/mirjam.jpg" />
</li>
<li>
<div class="tekstPersoon">
<h1>
Eric Govers
</h1>
<h2>
Warehouse Manager
</h2>
<p class="emailadres"><a href="mailto:eric@rooymansneckwear.nl">eric@rooymansneckwear.nl</a></p>
<p>
Als magazijnbeheerder houdt Eric zich bezig met alle binnenkomende en uitgaande leveringen. Hij zorgt er onder andere voor dat de voorraadcollectie constant aangevuld wordt, en is verantwoordelijk voor alle logistieke taken zoals het verpakken en versturen van orders. Ook een stukje kwaliteitscontrole behoort tot de taken van Eric: niets ontsnapt aan zijn aandacht!
</p>
</div>
<img src="/img/over_ons/erik.jpg" />
</li>
<li>
<div class="tekstPersoon">
<h1>
Anja Engelen
</h1>
<h2>
Office Support
</h2>
<p class="emailadres"><a href="mailto:anja@rooymansneckwear.nl">anja@rooymansneckwear.nl</a></p>
<p>
Anja is verantwoordelijk voor het administratief verwerken van alle dagelijkse webshop bestellingen van We Love Ties. Haar nauwkeurigheid en effectiviteit zijn eigenschappen die haar tot een multitalent maken. Ze zorgt er namelijk ook voor dat alle bestellingen netjes en keurig ingepakt worden, zodat de klant een ware cadeau ervaring ontvangt.
</p>
</div>
<img src="/img/over_ons/anja.jpg" />
</li>
<li>
<div class="tekstPersoon">
<h1>
Yvon van Dooren
</h1>
<h2>
Designer
</h2>
<p class="emailadres"><a href="mailto:yvon@rooymansneckwear.nl">yvon@rooymansneckwear.nl</a></p>
<p>
Yvon maakt als designer hoofdzakelijk ontwerpen voor stropdassen en sjaals. Ze spitst zich ook toe op het bedenken en vormgeven van ons drukwerk, de catalogus en alle online uitingen zoals nieuwsbrieven en posts op Instagram en Facebook. Haar creativiteit, snelheid en frisse kijk komen hierbij uitstekend tot zijn recht.
</p>
</div>
<img src="/img/over_ons/yvon.jpg" />
</li>
</ul>
</div>
<div class="headerMenu">
<a id="popUpArrowLeft"><span></span></a>
<div class="content">
<ul>
<li class="notActive gevuld">
<div class="up" style="background-image:url(/img/over_ons/thumb_patriek.jpg);"></div>
<div class="hover" style="background-image:url(/img/over_ons/thumb_patriek.jpg);"></div>
</li>
<li class="notActive gevuld">
<div class="up" style="background-image:url(/img/over_ons/thumb_pasquale.jpg);"></div>
<div class="hover" style="background-image:url(/img/over_ons/thumb_pasquale.jpg);"></div>
</li>
<li class="notActive gevuld">
<div class="up" style="background-image:url(/img/over_ons/thumb_joep.jpg);"></div>
<div class="hover" style="background-image:url(/img/over_ons/thumb_joep.jpg);"></div>
</li>
<li class="notActive gevuld">
<div class="up" style="background-image:url(/img/over_ons/thumb_nathalie.jpg);"></div>
<div class="hover" style="background-image:url(/img/over_ons/thumb_nathalie.jpg);"></div>
</li>
<li class="notActive gevuld">
<div class="up" style="background-image:url(/img/over_ons/thumb_kim.jpg);"></div>
<div class="hover" style="background-image:url(/img/over_ons/thumb_kim.jpg);"></div>
</li>
<li class="notActive gevuld">
<div class="up" style="background-image:url(/img/over_ons/thumb_maartje.jpg);"></div>
<div class="hover" style="background-image:url(/img/over_ons/thumb_maartje.jpg);"></div>
</li>
<li class="notActive gevuld">
<div class="up" style="background-image:url(/img/over_ons/thumb_ella.jpg);"></div>
<div class="hover" style="background-image:url(/img/over_ons/thumb_ella.jpg);"></div>
</li>
<li class="notActive gevuld">
<div class="up" style="background-image:url(/img/over_ons/thumb_mirjam.jpg);"></div>
<div class="hover" style="background-image:url(/img/over_ons/thumb_mirjam.jpg);"></div>
</li>
<li class="notActive gevuld">
<div class="up" style="background-image:url(/img/over_ons/thumb_erik.jpg);"></div>
<div class="hover" style="background-image:url(/img/over_ons/thumb_erik.jpg);"></div>
</li>
<li class="notActive gevuld">
<div class="up" style="background-image:url(/img/over_ons/thumb_anja.jpg);"></div>
<div class="hover" style="background-image:url(/img/over_ons/thumb_anja.jpg);"></div>
</li>
<li class="notActive gevuld">
<div class="up" style="background-image:url(/img/over_ons/thumb_yvon.jpg);"></div>
<div class="hover" style="background-image:url(/img/over_ons/thumb_yvon.jpg);"></div>
</li>
</ul>
</div>
<a id="popUpArrowRight"><span></span></a>
<div class="shadow"></div>
</div>
<div class="fotoVerlengde"></div>
</div>
<script type="text/javascript">
$('#popUpFrame .headerMenu .content li').hover(function(){
if($(this).hasClass('notActive')){
$("> .hover", this).stop().animate({"opacity": "1"}, "fast");
$("> .up", this).stop().animate({"opacity": "0"}, "fast");
}
},
function(){
if($(this).hasClass('notActive')){
$("> .up", this).stop().animate({"opacity": "1"}, "fast");
$("> .hover", this).stop().animate({"opacity": "0"}, "fast");
}
});
<?php echo("var activeFoto = ".$_GET['active'].";"); ?>
var totalFotos = $("#popUpFrame .headerMenu li.gevuld").length;
$("#popUpFrame .fotoFrame li").eq(activeFoto).css({'display':'block'});
$("#popUpFrame .label li").eq(activeFoto).css({'display':'block'});
$("#popUpFrame .headerMenu li.gevuld .up").eq(activeFoto).css("opacity","0");
$("#popUpFrame .headerMenu li.gevuld .hover").eq(activeFoto).css("opacity","1");
$("#popUpFrame .headerMenu li.gevuld").eq(activeFoto).toggleClass("active");
$("#popUpFrame .headerMenu li.gevuld").eq(activeFoto).toggleClass("notActive");
if(activeFoto > 5){
var aantalKeer = activeFoto - 6;
var aantalPixels = aantalKeer * -120;
aantalPixels = (aantalPixels - 49) + "px";
$("#popUpFrame .headerMenu ul").stop().animate({"left": aantalPixels}, "medium");
}
$('#popUpFrame .headerMenu li.gevuld').each(function(index) {
$(this).click(function(e){
e.preventDefault;
clickAction(index);
});
});
if($("#popUpArrowLeft").length){
$("#popUpArrowLeft").click(function(e){
e.preventDefault;
newActiveFoto = activeFoto - 1;
if(newActiveFoto < 0){ newActiveFoto = totalFotos - 1;}
clickAction(newActiveFoto);
});
}
if($("#popUpArrowRight").length){
$("#popUpArrowRight").click(function(e){
e.preventDefault;
newActiveFoto = activeFoto + 1;
if(newActiveFoto == totalFotos){ newActiveFoto = 0;}
clickAction(newActiveFoto);
});
}
function clickAction(newActive){
$("#popUpFrame .fotoFrame li").eq(activeFoto).fadeOut('slow');
$("#popUpFrame .label li").eq(activeFoto).fadeOut('slow');
$("#popUpFrame .headerMenu li.gevuld").eq(activeFoto).toggleClass("active");
$("#popUpFrame .headerMenu li.gevuld").eq(activeFoto).toggleClass("notActive");
$("#popUpFrame .headerMenu li.gevuld .up").eq(activeFoto).stop().animate({"opacity": "1"}, "medium");
$("#popUpFrame .headerMenu li.gevuld .hover").eq(activeFoto).stop().animate({"opacity": "0"}, "medium");
galleryPlay = false;
if(newActive > 5){
var aantalKeer = newActive - 6;
var aantalPixels = aantalKeer * -120;
aantalPixels = (aantalPixels - 49) + "px";
$("#popUpFrame .headerMenu ul").stop().animate({"left": aantalPixels}, "medium");
}else{
$("#popUpFrame .headerMenu ul").stop().animate({"left": "70px"}, "medium");
}
$("#popUpFrame .headerMenu li.gevuld").eq(newActive).toggleClass("active");
$("#popUpFrame .headerMenu li.gevuld").eq(newActive).toggleClass("notActive");
$("#popUpFrame .headerMenu li.gevuld .up").eq(newActive).stop().animate({"opacity": "0"}, "medium");
$("#popUpFrame .headerMenu li.gevuld .hover").eq(newActive).stop().animate({"opacity": "1"}, "medium");
$("#popUpFrame .fotoFrame li").eq(newActive).fadeIn('slow');
$("#popUpFrame .label li").eq(newActive).fadeIn('slow');
activeFoto = newActive;
}
</script>
</body>
</html>