IT3 - Opdracht9

Developer
Karlien Huygels
Size
7,019 Kb
Views
12,144
  1. IT3 - Opdracht9 Previews
  2. IT3 - Opdracht9 HTML Codes
  3. IT3 - Opdracht9 CSS Codes

How do I make an it3 - opdracht9?

What is a it3 - opdracht9? How do you make a it3 - opdracht9? This script and codes were developed by Karlien Huygels on 29 October 2022, Saturday.

IT3 - Opdracht9 Previews
IQ Test

IT3 - Opdracht9 - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>IT3 - Opdracht9</title> <link href="https://fonts.googleapis.com/css?family=Anton|Lobster|Oswald" rel="stylesheet"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class="parallax"> <div id="group1" class="parallax__group"> <div class="parallax__layer parallax__layer--base"> <div class="title"><h1>ROCK WERCHTER 2016</h1></div> <div class="subtitle"><h2>Top 10 best artists</h2></div> <div class="link"><a href="https://karlien-huygels.github.io/opdracht9/" target="_blank">Check this site out on github</a></div> </div> </div> <div id="group2" class="parallax__group"> <div class="parallax__layer parallax__layer--base"> <div class="title base">NO. 1</div> </div> <div class="parallax__layer parallax__layer--back"> <div class="title"></div> </div> </div> <div id="group3" class="parallax__group"> <div class="parallax__layer parallax__layer--fore"> <div class="title"> <div class="imagefore"> <img src="https://cds.stubru.be/sites/stubru/files/styles/scale1200/public/article/fotoreeks/2016_09/rock_werchter_2016_-_03._zaterdag_-_03._bazart_-_008.jpg?itok=qtTOgH5o"> </div> </div> </div> <div class="parallax__layer parallax__layer--base"> <div class="description"> <h3>BAZART</h3> <p>De Gent-Antwerpse groep trekt steevast een legioen zwijmelende meisjes aan, maar ook hun vriendjes en stille minnaars lieten zich niet onbetuigd tijdens het concert op Rock Werchter. Met de singles 'Tunnels' en 'Chaos' steeg de temperatuur naar subtropische hoogte, maar de heetste climax? Die volgde bij de eerste tonen van 'Goud' natuurlijk. "Ik heb al de hele tijd kippenvel," bekent Mathieu Terryn na 'Tunnels'.</p> </div> </div> </div> <div id="group4" class="parallax__group"> <div class="parallax__layer parallax__layer--base"> <div class="title base">NO. 2</div> </div> <div class="parallax__layer parallax__layer--back"> <div class="title"></div> </div> </div> <div id="group5" class="parallax__group"> <div class="parallax__layer parallax__layer--fore"> <div class="title"> <div class="imagefore"> <img src="http://focus.knack.be/medias/10238/5242243.jpg"> </div></div> </div> <div class="parallax__layer parallax__layer--base"> <div class="title"> <div class="description"> <h3>LOST FREQUENCIES</h3> <p>“Werchter, are you with me?” Het was een voorspelbare vraag na een dj-set die ook al weinig verrassingen bood, maar die de tent wel vakkundig op stelten zette.Zijn set was dan ook een gevalletje ‘voor elk wat wils’: af en toe eens fors doorstompen voor de clubbers (‘Down’ van Chemical Surf), op gezette tijden een geremixt hitje (‘Bongo Bong’, ‘Jump Around’, ‘What Is Love’) en voorts gemoedelijke beats waar niemand zich aan kon storen.</p> </div> </div> </div> </div> <div id="group6" class="parallax__group"> <div class="parallax__layer parallax__layer--back"> <div class="title"></div> </div> <div class="parallax__layer parallax__layer--base"> <div class="title base">NO. 3</div> </div> </div> <div id="group7" class="parallax__group"> <div class="parallax__layer parallax__layer--fore"> <div class="title"> <div class="imagefore"> <img src="http://www.cuttingedge.be/system/files/styles/gallery_large/private/20160701-img_9738_0.jpg?itok=E0WZsaKP"> </div></div> </div> <div class="parallax__layer parallax__layer--base"> <div class="title"> <div class="description"> <h3>DAUGHTER</h3> <p>Broos ligt soms beter in de markt dan boos. Want wat is er fijner voor een ordinaire sukkel zoals u en ik dan vast te stellen dat onze muzikale helden óók sukkels zijn? Lieden met angsten en twijfels, die hun leven net zo min onder controle hebben als wij. Eén en ander verklaart de populariteit van Daughter, het creatieve vehikel van zangeres-gitariste Elena Tonra en gitarist Igor Haefemi.</p> </div> </div> </div> </div> <div id="group8" class="parallax__group"> <div class="parallax__layer parallax__layer--back"> <div class="title"></div> </div> <div class="parallax__layer parallax__layer--base"> <div class="title base">NO. 4</div> </div> </div> <div id="group9" class="parallax__group"> <div class="parallax__layer parallax__layer--fore"> <div class="title"> <div class="imagefore"> <img src="http://www.standaard.be/extra/assets/extra/dslive/festivals_beste-concerten/img/bands/years%20years.jpg"> </div></div> </div> <div class="parallax__layer parallax__layer--base"> <div class="title"> <div class="description"> <h3>YEARS & YEARS</h3> <p>Posterboy Olly Alexander, die menig vrouw (en man) knikkende knietjes bezorgt, speelt met zijn geverfde blonde lokken gedoodverfde rol van Justin Timberlake in diens *NSYNC periode en profileert zich als het overduidelijke middelpunt van de band. Net als Justin (en The Weeknd) doet Olly zijn beste Michael Jackson imitatie.<p> </div> </div> </div> </div> <div id="group10" class="parallax__group"> <div class="parallax__layer parallax__layer--back"> <div class="title"></div> </div> <div class="parallax__layer parallax__layer--base"> <div class="title base">NO. 5</div> </div> </div> <div id="group11" class="parallax__group"> <div class="parallax__layer parallax__layer--fore"> <div class="title"> <div class="imagefore"> <img src="http://images-mds.staticskynet.be/News/w-556_h-417_s-1/2-10_636029154453943678.jpg"> </div></div> </div> <div class="parallax__layer parallax__layer--base"> <div class="title"> <div class="description"> <h3>FLUME</h3> <p>"Kiss me, Flume!" Dat lazen we op één van de pancartes in een uitpuilende tent. Kussen met een fluim? Dank je lekker! Al op dag één vergleden de tijdelijke logé's van Werchter kennelijk in het soort orale omgang waar je huisdokter ernstige bedenkingen bij zou hebben. Maar toegegeven: deze Flume voelde effectief aan als een innige kus. Meer nog: het leek wel alsof deze Harley Streten een paringsritueel in slow motion ondernam met zijn publiek.<p> </div> </div> </div> </div> <div id="group12" class="parallax__group"> <div class="parallax__layer parallax__layer--back"> <div class="title"></div> </div> <div class="parallax__layer parallax__layer--base"> <div class="title base">NO. 6</div> </div> </div> <div id="group13" class="parallax__group"> <div class="parallax__layer parallax__layer--fore"> <div class="title"> <div class="imagefore"> <img src="http://farm3.staticflickr.com/2828/9232437757_562ac7eebf.jpg"> </div></div> </div> <div class="parallax__layer parallax__layer--base"> <div class="title"> <div class="description"> <h3>EDITORS</h3> <p>"We can’t get too miserable tonight", monkelde Tom Smith. Uiteindelijk was het zaterdagnacht, niet waar? Niettemin las je op de grote tv-schermen doffe treurnis in zijn blik, en een aan wanhoop grenzende weemoed. Zou het zware tourleven deze brave jongen inmiddels te grazen hebben genomen? Of deed het eigen troosteloze decor van Editors hem stilaan de das om?<p> </div> </div> </div> </div> <div id="group14" class="parallax__group"> <div class="parallax__layer parallax__layer--back"> <div class="title"></div> </div> <div class="parallax__layer parallax__layer--base"> <div class="title base">NO. 7</div> </div> </div> <div id="group15" class="parallax__group"> <div class="parallax__layer parallax__layer--fore"> <div class="title"> <div class="imagefore"> <img src="https://cds.stubru.be/sites/stubru/files/styles/scale1200/public/article/fotoreeks/2016_06/2016-06-30_-_19u14_-_1785.jpg?itok=YwrZ8BND"> </div></div> </div> <div class="parallax__layer parallax__layer--base"> <div class="title"> <div class="description"> <h3>ELLIE GOULDING</h3> <p>Wat is de norm? Op Werchter, tijdens het regenseizoen, geldt eigenlijk: een goed optreden is een optreden dat het publiek de regen, de modder en het drijfzand doet vergeten. Gek, eigenlijk: niemand gaat ooit uit vrije wil een terrasje doen in de regen, of dineren in de regen, of vrijen in de modder, maar hele massa’s luisteren uit vrije wil naar muziek in de regen. Wat dat betreft had Ellie Goulding geluk: Jake had de zondvloed over zich heen gekregen, en de wolken waren leeg.<p> </div> </div> </div> </div> <div id="group16" class="parallax__group"> <div class="parallax__layer parallax__layer--back"> <div class="title"></div> </div> <div class="parallax__layer parallax__layer--base"> <div class="title base">NO. 8</div> </div> </div> <div id="group17" class="parallax__group"> <div class="parallax__layer parallax__layer--fore"> <div class="title"> <div class="imagefore"> <img src="https://cds.stubru.be/sites/stubru/files/styles/scale1200/public/article/fotoreeks/2016_07/2016-01-01_-_02u00_-_3577_0.jpg?itok=2traJ2tq"> </div></div> </div> <div class="parallax__layer parallax__layer--base"> <div class="title"> <div class="description"> <h3>BLACK BOX REVELATION</h3> <p>Het zal verdorie de veertigste keer zijn dat we BBR bespreken. Je zou denken dat de Werchter-veteranen zich niet meer zouden hoeven te bewijzen voor het thuispubliek, maar na al die jaren klinken Paternoster en Van Dyck nog steeds hongerig als twee aan Percocet verslaafde mijnwerkers die twee weken geen zonlicht hebben gezien en dagenlang op hetzelfde stukje kauwtabak hebben gekauwd.<p> </div> </div> </div> </div> <div id="group18" class="parallax__group"> <div class="parallax__layer parallax__layer--back"> <div class="title"></div> </div> <div class="parallax__layer parallax__layer--base"> <div class="title base">NO. 9</div> </div> </div> <div id="group19" class="parallax__group"> <div class="parallax__layer parallax__layer--fore"> <div class="title"> <div class="imagefore"> <img src="https://cds.stubru.be/sites/stubru/files/styles/scale1200/public/article/fotoreeks/2016_06/2016-06-30_-_15u40_-_1167.jpg?itok=CQogUffE"> </div></div> </div> <div class="parallax__layer parallax__layer--base"> <div class="title"> <div class="description"> <h3>KAISER CHIEFS</h3> <p>I'd like to pass this message to the press, zong Ricky Wilson in 'Every day I love you less and less'. Ik vrees dat de boodschap was dat de zesde beurt van de Kaiser Chiefs op het beste festival ter wereld wat teleurstelde. Ben ik nu echt de enige die er een hekel aan heeft dat frontmen tot vervelens toe oproepen om te klappen, zingen, roepen, springen? Hoe meer zo'n demagoog dat opdringt, hoe minder zin ik er in heb. Op Werchter telt niet zozeer hoe briljant je bent, maar wel in welke mate je een doorweekte wei meekrijgt.<p> </div> </div> </div> </div> <div id="group20" class="parallax__group"> <div class="parallax__layer parallax__layer--back"> <div class="title"></div> </div> <div class="parallax__layer parallax__layer--base"> <div class="title base">NO. 10</div> </div> </div> <div id="group21" class="parallax__group"> <div class="parallax__layer parallax__layer--fore"> <div class="title"> <div class="imagefore"> <img src="https://i.ytimg.com/vi/bPTEWDHVlw8/maxresdefault.jpg"> </div></div> </div> <div class="parallax__layer parallax__layer--base"> <div class="title"> <div class="description"> <h3>WALK OFF THE EARTH</h3> <p>Herinnerde ù hen nog? Walk Off The Earth was zowat de grootste YouTube-sensatie van 2012. Met zijn vijven speelde deze Canadese groep tegelijk op eenzelfde gitaar terwijl ze Gotye's 'Somebody that I used to know' naar hun handen zetten. Het groeide uit tot de vaakst aangeklikte cover van het jaar. Maar zoals Gotye voor eeuwig en een dag afgerekend zal worden op die ene oorwurm, leek Walk Off the Earth ook vast te blijven hangen aan die ene viral video en geinige gimmick.<p> </div> </div> </div> </div> <div id="group22" class="parallax__group"> <div class="parallax__layer parallax__layer--back"> <div class="title"></div> </div> <div class="parallax__layer parallax__layer--base"> <div class="title base"></div> </div> </div> <div id="group23" class="parallax__group"> <div class="parallax__layer parallax__layer--base"> <div class="title"> <div class="description"> <h3>ROCK WERCHTER 2016</h3> </div> </div> </div> </div> </div>
</body>
</html>

IT3 - Opdracht9 - Script Codes CSS Codes

/* Parallax base styles --------------------------------------------- */ .parallax { height: 500px; /* fallback for older browsers */ height: 100vh; overflow-x: hidden; overflow-y: auto; -webkit-perspective: 300px; perspective: 300px; } .parallax__group { position: relative; height: 500px; /* fallback for older browsers */ height: 100vh; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } .parallax__layer { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } .parallax__layer--fore { -webkit-transform: translateZ(90px) scale(.7); transform: translateZ(90px) scale(.7); z-index: 1; } .parallax__layer--base { -webkit-transform: translateZ(0); transform: translateZ(0); z-index: 4; } .parallax__layer--back { -webkit-transform: translateZ(-300px) scale(2); transform: translateZ(-300px) scale(2); z-index: 3; } .parallax__layer--deep { -webkit-transform: translateZ(-600px) scale(3); transform: translateZ(-600px) scale(3); z-index: 2; } /* demo styles --------------------------------------------- */ body, html { overflow: hidden; } body { font: 100% / 1.5 Arial; } * { margin:0; padding:0; } .parallax { font-size: 200%; } /* centre the content in the parallax layers */
h1{ font-family: 'Anton', sans-serif; letter-spacing: 5px; margin-bottom: 10px; font-size: 0.8em;
}
h3{ font-family: 'Anton', sans-serif; letter-spacing: 5px; font-size: 1.5em;
} .title { text-align: center; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
.subtitle{ color: white; font-family: 'Lobster', cursive; text-align: center; position: absolute; left: 50%; top: 30%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); font-size: 1.5em;
}
.base { font-size: 5em; color: white; font-family: 'Anton', sans-serif;
}
.imagefore{ width: 600px; -webkit-transform: translate(40%, 0%); transform: translate(40%, 0%);
}
.imagefore img{ width: 100%;
}
.link{ text-align: center; position: absolute; left: 50%; top: 70%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);
}
a{ color: white; text-decoration: none; font-family: 'Anton', sans-serif;
}
a:hover{ border-bottom: 5px solid white;
} /* style the groups --------------------------------------------- */
/*GROUP1*/ #group1 { z-index: 5; /* slide over group 2 */ } #group1 .title{ color: white; font-size: 3.5em; font-family: 'Anton', sans-serif; } #group1 .parallax__layer--base { background: #00C9FF; /* fallback for old browsers */ background: -webkit-linear-gradient(to left, #00C9FF , #92FE9D); /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to left, #00C9FF , #92FE9D); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ }
/*GROUP2*/ #group2 { z-index: 3; /* slide under groups 1 and 3 */ } #group2 .parallax__layer--back { color: white; background-image: url("https://cds.stubru.be/sites/stubru/files/styles/scale1200/public/article/fotoreeks/2015_12/bazart-4_0.jpg?itok=dEnnIoMs"); background-size: 100%; }
/*GROUP3*/ #group3 { z-index: 4; /* slide over group 2 and 4 */ } #group3 .parallax__layer--base { background: #00C9FF; /* fallback for old browsers */ background: -webkit-linear-gradient(to left, #00C9FF , #92FE9D); /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to left, #00C9FF , #92FE9D); color: white; } #group3 .description{ color: white; width: 400px; margin-left: 20%; margin-top: 2%; font-size: 0.5em; text-align: justify; }
/*GROEP4*/ #group4 { z-index: 2; /* slide under group 3 and 5 */ } #group4 .parallax__layer--back { background-image: url("http://www.billboard.com/files/media/Lost-Frequencies-press-2016-billboard-1548.jpg"); background-size: 100%; }
/*GROUP5*/ #group5 { z-index: 3; /* slide over group 4 and 6 */ } #group5 .parallax__layer--base { background: #00C9FF; /* fallback for old browsers */ background: -webkit-linear-gradient(to left, #00C9FF , #92FE9D); /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to left, #00C9FF , #92FE9D); } #group5 .description{ color: white; width: 400px; margin-left: -90%; margin-top: 2%; font-size: 0.5em; text-align: justify; }
/*GROUP6*/ #group6 { z-index: 2; /* slide under group 5 and 7 */ } #group6 .parallax__layer--back { background-image: url("http://muzify.nl/wp-content/uploads/2016/03/Daughter-Feb-20151119-Emma-Swann-9611-copy.jpg"); background-size: 100%; }
/*GROUP7*/ #group7 { z-index: 3; /* slide over group 7 */ } #group7 .parallax__layer--base { background: #00C9FF; /* fallback for old browsers */ background: -webkit-linear-gradient(to left, #00C9FF , #92FE9D); /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to left, #00C9FF , #92FE9D); } #group7 .description{ color: white; width: 400px; margin-left: -90%; margin-top: 2%; font-size: 0.5em; text-align: justify; }
/*GROUP8*/ #group8 { z-index: 2; /* slide over group 7 */ } #group8 .parallax__layer--back { background-image: url("https://www.artiestennieuws.nl/wp-content/uploads/2016/03/Years-Years.jpg"); background-size: 100%; }
/*GROUP9*/ #group9 { z-index: 4; /* slide over group 2 and 4 */ } #group9 .parallax__layer--base { background: #00C9FF; /* fallback for old browsers */ background: -webkit-linear-gradient(to left, #00C9FF , #92FE9D); /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to left, #00C9FF , #92FE9D); color: white; } #group9 .description{ color: white; width: 400px; margin-left: -90%; margin-top: 2%; font-size: 0.5em; text-align: justify; }
/*GROUP10*/ #group10 { z-index: 2; /* slide over group 7 */ } #group10 .parallax__layer--back { background-image: url("https://cdn1-www.musicfeeds.com.au/assets/uploads/flume-2016-press-pic-16-9-source-supplied.jpg"); background-size: 100%; }
/*GROUP11*/ #group11 { z-index: 3; /* slide over group 2 and 4 */ } #group11 .parallax__layer--base { background: #00C9FF; /* fallback for old browsers */ background: -webkit-linear-gradient(to left, #00C9FF , #92FE9D); /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to left, #00C9FF , #92FE9D); color: white; } #group11 .description{ color: white; width: 400px; margin-left: -90%; margin-top: 2%; font-size: 0.5em; text-align: justify; }
/*GROUP12*/ #group12 { z-index: 2; /* slide over group 7 */ } #group12 .parallax__layer--back { background-image: url("http://www.ishetalwerchter.nl/wp-content/uploads/editros.jpg"); background-size: 100%; }
/*GROUP13*/
#group13 { z-index: 3; /* slide over group 2 and 4 */ } #group13 .parallax__layer--base { background: #00C9FF; /* fallback for old browsers */ background: -webkit-linear-gradient(to left, #00C9FF , #92FE9D); /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to left, #00C9FF , #92FE9D); color: white; } #group13 .description{ color: white; width: 400px; margin-left: -90%; margin-top: 2%; font-size: 0.5em; text-align: justify; }
/*GROUP14*/ #group14 { z-index: 2; /* slide over group 7 */ } #group14 .parallax__layer--back { background-image: url("https://cds.mnm.be/sites/mnm/files/styles/1600x800/public/article/2015_10/ellie-goulding-to-release-new-al.jpg?itok=kyR-xXCg"); background-size: 100%; }
/*GROUP15*/ #group15 { z-index: 3; /* slide over group 2 and 4 */ } #group15 .parallax__layer--base { background: #00C9FF; /* fallback for old browsers */ background: -webkit-linear-gradient(to left, #00C9FF , #92FE9D); /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to left, #00C9FF , #92FE9D); color: white; } #group15 .description{ color: white; width: 400px; margin-left: -90%; margin-top: 2%; font-size: 0.5em; text-align: justify; }
/*GROUP16*/ #group16 { z-index: 2; /* slide over group 7 */ } #group16 .parallax__layer--back { background-image: url("http://www.rockvoorspecials.be/rvs/wp-content/uploads/2016/03/blackboxrevelation.jpg"); background-size: 100%; }
/*GROUP17*/ #group17 { z-index: 3; /* slide over group 2 and 4 */ } #group17 .parallax__layer--base { background: #00C9FF; /* fallback for old browsers */ background: -webkit-linear-gradient(to left, #00C9FF , #92FE9D); /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to left, #00C9FF , #92FE9D); color: white; } #group17 .description{ color: white; width: 400px; margin-left: -90%; margin-top: 2%; font-size: 0.5em; text-align: justify; }
/*GROUP18*/ #group18 { z-index: 2; /* slide over group 7 */ } #group18 .parallax__layer--back { background-image: url("https://www.doornroosje.nl/wp-content/uploads/2014/09/Kaiser-Chiefs-1920x1080.jpg"); background-size: 100%; }
/*GROUP19*/ #group19 { z-index: 3; /* slide over group 2 and 4 */ } #group19 .parallax__layer--base { background: #00C9FF; /* fallback for old browsers */ background: -webkit-linear-gradient(to left, #00C9FF , #92FE9D); /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to left, #00C9FF , #92FE9D); color: white; } #group19 .description{ color: white; width: 400px; margin-left: -90%; margin-top: 2%; font-size: 0.5em; text-align: justify; }
/*GROUP20*/ #group20 { z-index: 2; /* slide over group 7 */ } #group20 .parallax__layer--back { background-image: url("https://www.walkofftheearth.com/wp-content/themes/walkofftheearth/assets/img/bg/home-top-new.png"); background-size: 100%; }
/*GROUP21*/ #group21 { z-index: 3; /* slide over group 2 and 4 */ } #group21 .parallax__layer--base { background: #00C9FF; /* fallback for old browsers */ background: -webkit-linear-gradient(to left, #00C9FF , #92FE9D); /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to left, #00C9FF , #92FE9D); color: white; } #group21 .description{ color: white; width: 400px; margin-left: -90%; margin-top: 2%; font-size: 0.5em; text-align: justify; }
/*GROUP22*/ #group22 { z-index: 2; /* slide over group 7 */ } #group22 .parallax__layer--back { background-image: url("https://img.youtube.com/vi/4Rki32HwpeA/maxresdefault.jpg"); background-size: 100%; }
/*GROUP23*/ #group23 { z-index: 3; /* slide over group 2 and 4 */ } #group23 .parallax__layer--base { background: #00C9FF; /* fallback for old browsers */ background: -webkit-linear-gradient(to left, #00C9FF , #92FE9D); /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to left, #00C9FF , #92FE9D); color: white; } #group23 .description{ color: white; width: 400px; margin-left: -90%; margin-top: 2%; font-size: 0.5em; text-align: justify; }
#group23.parallax__group { position: relative; height: 250px; /* fallback for older browsers */ -webkit-transform-style: preserve-3d; transform-style: preserve-3d; }
/*MEDIA QUERY*/
@media only screen and (max-width: 1660px){ h1{ font-size: 0.6em; } .imagefore img{ width: 80%; }
}
@media only screen and (max-width: 1400px){ #group3 .description{ margin-left: 10%; }
}
@media only screen and (max-width: 1300px){ h1{ font-size: 0.4em; } h2{ font-size: 0.8em; }
}
@media only screen and (max-width: 1200px){ #group3 .description{ margin-left: 10%; width: 350px; } #group5 .description, #group7 .description, #group9 .description, #group11 .description, #group13 .description, #group15 .description, #group17 .description, #group19 .description, #group21 .description, #group23 .description{ margin-left: -70%; width: 350px; }
}
@media only screen and (max-width: 1050px){ #group3 .description{ margin-left: 10%; width: 350px; } .imagefore img{ width: 60%; }
}
@media only screen and (max-width: 950px){ #group1.parallax__group { position: relative; height: 250px; /* fallback for older browsers */ -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } h1{ font-size: 0.3em; } h2{ font-size: 0.8em; } a{ font-size: 0.6em; }
}
@media only screen and (max-width: 880px){ #group1.parallax__group { position: relative; height: 250px; /* fallback for older browsers */ -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } #group3 .description{ margin-left: 10%; width: 300px; } #group5 .description, #group7 .description, #group9 .description, #group11 .description, #group13 .description, #group15 .description, #group17 .description, #group19 .description, #group21 .description, #group23 .description{ margin-left: -50%; width: 300px; } .imagefore img{ width: 40%; }
}
@media only screen and (max-width: 750px){ h1{ font-size: 0.2em; } h2{ font-size: 0.5em; }
}
IT3 - Opdracht9 - Script Codes
IT3 - Opdracht9 - Script Codes
Home Page Home
Developer Karlien Huygels
Username KarlienHuygels
Uploaded October 29, 2022
Rating 3
Size 7,019 Kb
Views 12,144
Do you need developer help for IT3 - Opdracht9?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Karlien Huygels (KarlienHuygels) Script Codes
Name
CMT3 - Opdracht7
CMT3 - Opdracht4
CMT3 - Opdracht14
CMT3 - Opdracht15
IT3 - Opdracht5
CMT3 Portfolio
IT3 - Opdracht12
IT3 - Opdracht11
Grid layout draft
IT3 - Opdracht2
Create amazing sales emails with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!