Differences

This shows you the differences between two versions of the page.

--- mattias_10 [2019-11-21 19:55]
Mattias Hamberg [Instruktioner]
+++ mattias_10 [2022-07-18 13:20] (current)
@@ Line 12: / Line 12: @@
 Eller rent av såhär:
-  <video src="videos/basta_filmen.mp4" controls>
+  <video src="videos/basta_filmen.mp4" controls></video>
 Det format som fungerar bäst är formatet `mp4`, alltså filmer komprimerade med`H.264`. Ett annat sätt att göra samma sak, är att använda `.ogg` medan man har `mp4` som backup är att göra såhär:
@@ Line 28: / Line 28: @@
 Ladda ner denna {{mattias_10.zip|zip-fil}}
-  - Gör en topplista över dina fem roligaste klipp
+  - Länka till stilmallen `style.css` i `index.html`
+  - Gör en topplista över dina fem roligaste klipp. Skriv gärna en motivering till varför du tycker att videon är rolig också.
   - Minst ett av klippen i mappen `videos/` måste vara med på listan
-  - Minst ett klipp måste du hämta ifrån YouTube. Hur du gör det kan du läsa om här: https://support.google.com/youtube/answer/171780?hl=sv
+  - Minst ett klipp måste du lägga till ifrån YouTube. Hur du gör det kan du läsa om här: https://support.google.com/youtube/answer/171780?hl=sv
-  - Minst ett klipp måste du hämta ifrån Vimeo. Hur du gör det kan du läsa om här: https://vimeo.zendesk.com/hc/en-us/articles/224969968-Embedding-videos-overview
+  - Minst ett klipp måste du lägga till ifrån Vimeo. Hur du gör det kan du läsa om här: https://vimeo.zendesk.com/hc/en-us/articles/224969968-Embedding-videos-overview
-  - Designa din topplista så att den blir snygg
+  - Designa din topplista så att den blir snygg och funkar med såväl bred som smal skärm
   - Lämna in den på vklass
+  - Lek vidare med din sida:
+    - Testa att göra dina iframes responsiva. Mer om det kan du läsa här: https://www.w3schools.com/howto/howto_css_responsive_iframes.asp
+    - Prova att lägga till en video ifrån Twitch. Hur du gör det kan du läsa här: https://dev.twitch.tv/docs/embed/video-and-clips
+    - Kolla hur kan få en video att starta automatiskt: https://www.w3schools.com/html/html5_video.asp
+    - Prova att göra så att filmen loopas om och om igen: https://www.w3schools.com/html/html5_video.asp
+    - Försök också gärna göra filmerna svartvita: https://www.w3schools.com/cssref/css3_pr_filter.asp
+    - Testa gärna också att lägga en film som bakgrund: https://www.w3schools.com/howto/howto_css_fullscreen_video.asp