diff --git a/src/app/app.component.scss b/src/app/app.component.scss
index 5127cfd..22c6daf 100644
--- a/src/app/app.component.scss
+++ b/src/app/app.component.scss
@@ -7,6 +7,7 @@
"topmenu"
"content"
"reclame";
+ grid-template-rows: auto 1fr 200px;
}
app-reclamespinner {
diff --git a/src/app/reclamespinner/reclamespinner.component.html b/src/app/reclamespinner/reclamespinner.component.html
index bfe9e57..ef0dbe4 100644
--- a/src/app/reclamespinner/reclamespinner.component.html
+++ b/src/app/reclamespinner/reclamespinner.component.html
@@ -1,3 +1,7 @@
-
- KOOP MEER WORST
+
+
+
+

+
+
diff --git a/src/app/reclamespinner/reclamespinner.component.scss b/src/app/reclamespinner/reclamespinner.component.scss
index 33f6c85..a35dbd6 100644
--- a/src/app/reclamespinner/reclamespinner.component.scss
+++ b/src/app/reclamespinner/reclamespinner.component.scss
@@ -3,3 +3,25 @@ div {
width: 100%;
height: 100%;
}
+
+#reclamespinner {
+ display: grid;
+ grid-template-rows: 1fr;
+ grid-auto-flow: column;
+ overflow: hidden;
+}
+.reclameitem {
+ height: 100%;
+}
+
+#goleftbutton, #gorightbutton {
+ position: absolute;
+}
+
+#goleftbutton {
+ left: 0px;
+}
+
+#gorightbutton {
+ right: 0px;
+}
diff --git a/src/app/reclamespinner/reclamespinner.component.ts b/src/app/reclamespinner/reclamespinner.component.ts
index 13fcc0b..f0266f8 100644
--- a/src/app/reclamespinner/reclamespinner.component.ts
+++ b/src/app/reclamespinner/reclamespinner.component.ts
@@ -1,4 +1,4 @@
-import { Component, OnInit } from '@angular/core';
+import {Component, OnInit} from '@angular/core';
@Component({
selector: 'app-reclamespinner',
@@ -7,9 +7,24 @@ import { Component, OnInit } from '@angular/core';
})
export class ReclamespinnerComponent implements OnInit {
- constructor() { }
+ protected images: string[] = [];
+
+ constructor() {
+ this.images.push('Victoria.jpg');
+ this.images.push('basta.png');
+ }
ngOnInit() {
}
+ goRight() {
+ let s = this.images.pop();
+ this.images.splice(0, 0, s);
+ }
+
+ goLeft() {
+ const string = this.images[0];
+ this.images.splice(0, 1);
+ this.images.push(string);
+ }
}