Just nu i M3-nätverket
Gå till innehåll

Sök

Visar resultat för taggar 'bildspel fade css3'.

  • Sök efter taggar

    Skriv taggar separerade med kommatecken.
  • Sök efter författare

Innehållstyp


Forum

  • Datorhårdvara
    • Bildskärmar
    • Bärbara datorer
    • Grafikkort
    • Hårddiskar & Lagringsmedia
    • Ljudkort
    • Mac-hårdvara
    • Processorer, moderkort & minnen
    • Retro - datornostalgi
    • Skrivare
    • TV-kort
    • Hårdvara – övrigt
    • Arkiverat
  • Film, foto & bilder
    • Bildredigering
    • Film- och Videoredigering
    • Kameror
    • Mediaspelare – Media Player m fl
  • Internet & nätverk
    • Chattprogram - ICQ, MSN m fl
    • Driftstörningar hos operatörer, internet etc
    • Epostprogram
    • Internetuppkoppling
    • IP-telefoni
    • Nätverket - hårdvara
    • Nätverket - programvara
    • Surftips
    • Webbläsare
    • Internet – övrigt
  • Ljud och Musik
    • Ljudformat (mp3, aac, ogg m fl)
    • Musikskapande på datorn
    • Ljud & Musik – övrigt
  • Operativsystem
    • Windows 10
    • Windows 8 & 8.1
    • Windows 7
    • Windows Vista
    • Windows XP
    • Windows 95/98/ME/NT/2000
    • Windows Server
    • Linux & Unix
    • Mac OS X & Classic
    • Operativsystem - övriga
    • Arkiverade Windows-trådar
  • Program
    • CD/DVD-bränning
    • Kalkylprogram - Excel m fl
    • Mac-program
    • Ordbehandling - Word m fl
    • Presentation – PowerPoint m fl
    • Print - om trycksaker
    • Program - övriga
  • Spel
    • Datorspel
    • Konsoler & konsolspel
  • Säkerhet
    • Brandväggar
    • Skräppost
    • Virus, skadliga program & botemedel
    • Säkerhet - övrigt
  • Hemelektronik
    • DVD & Blu-ray
    • Hemmabio/HTPC
    • El & övrig hemelektronik
  • Mobilt
    • Surfplattor
    • Mobiltelefoner
    • Bärbart Ljud/Mp3-spelare
    • GPS
    • Handdatorer
    • Mobilt – övrigt
  • Tips inför köpet
    • Köpa/Bygga dator
    • Köpa datortillbehör och komponenter
    • Köpa kamera
    • Köpa gps
    • Köpa internetabonnemang
    • Köpa IP-telefoni och fast telefoni
    • Köpa mobila enheter
    • Köpa nätverksutrustning
    • Köpa/Bestämma program
    • Köpa tv, hemmabio och mediacenter
  • System- och webbutveckling
    • Databaser
    • Systemutveckling
    • Webbutveckling
  • Eforum
    • Diskutera Eforum
    • Buggrapporter och önskemål om Eforum
    • PC för Alla
    • Arkiverat: Smart-forumet
  • Övrigt

Hitta resultat i...

Hitta resultat som...


Datum skapat

  • Start

    Slut


Senast uppdaterad

  • Start

    Slut


Filtrera efter antalet...

Gick med

  • Start

    Slut


Grupp


Facebook


Linkedin


Hemsida


Twitter


MSN


ICQ


Yahoo


Jabber


Skype


AIM


Ort


Intressen


Min dator


IT-kunskaper

Hittade 1 resultat

  1. Hej! Jag har sökt förtvivlat efter ett bildspel med fade som inte använder script. Till slut hittade jag ett som jag har modifierat men det funkar dåligt. En svart bakgrund först ett långt tag innan bilderna kommer. kan någon se vad som är fel? Problemet är att jag har praktiskt ingen aning om vad koderna betyder utan jag har bara provat mig fram Mitt html set ut som följande: <!doctype html> <html class="no-js" lang="sv"> <head> <title>test</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="author" content="test" /> <meta name="description" content="Beskriver sidans innehåll" /> <meta name="keywords" content="Olika, sökord, test" /> <link rel="stylesheet" href="style.css" type="text/css" /> </head> <body> <div class="wrap"> <!-- wrap box totala sidan --> <div class="bildspel"> <!-- bildspel box sidan --> <div id="crossfade"> <!-- box rullande text indexsidan --> <img src="images/1.jpg" alt="Image 1"> <img src="images/2.jpg" alt="Image 2"> <img src="images/3.jpg" alt="Image 3"> <img src="images/4.jpg" alt="Image 4"> <img src="images/5.jpg" alt="Image 5"> <img src="images/6.jpg" alt="Image 6"> </div> </div> <!-- bildspel-box sidan --> </div> <!-- wrap-box totala sidan --> </body> </html> Mitt CSS ser ut: .bildspel { background-color: #000000; height: 26em; padding: 0px; border: 0px solid blue; } #crossfade > img { max-width: 860px; width: 90%; height: auto; position: absolute; top: 0px; margin: auto; color: transparent; opacity: 0; z-index: 0; animation: imageAnimation 72s linear infinite 0s; -webkit-backface-visibility: hidden; -webkit-animation: imageAnimation 72s linear infinite 0s; -moz-animation: imageAnimation 72s linear infinite 0s; -o-animation: imageAnimation 72s linear infinite 0s; -ms-animation: imageAnimation 72s linear infinite 0s; animation: imageAnimation 72s linear infinite 0s; border: 0px solid orange; } #crossfade > img:nth-child(1) { -webkit-animation-delay: 12s; -moz-animation-delay: 12s; -o-animation-delay: 12s; -ms-animation-delay: 12s; animation-delay: 12s; } #crossfade > img:nth-child(2) { -webkit-animation-delay: 24s; -moz-animation-delay: 24s; -o-animation-delay: 24s; -ms-animation-delay: 24s; animation-delay: 24s; } #crossfade > img:nth-child(3) { -webkit-animation-delay: 36s; -moz-animation-delay: 36s; -o-animation-delay: 36s; -ms-animation-delay: 36s; animation-delay: 36s; } #crossfade > img:nth-child(4) { -webkit-animation-delay: 48s; -moz-animation-delay: 48s; -o-animation-delay: 36s; -ms-animation-delay: 48s; animation-delay: 48s; } #crossfade > img:nth-child(5) { -webkit-animation-delay: 60s; -moz-animation-delay: 60s; -o-animation-delay: 60s; -ms-animation-delay: 60s; animation-delay: 60s; } #crossfade > img:nth-child(6) { -webkit-animation-delay: 72s; -moz-animation-delay: 72s; -o-animation-delay: 72s; -ms-animation-delay: 72s; animation-delay: 72s; } @keyframes imageAnimation { 0% { opacity: 0; animation-timing-function: ease-in; } 3% { opacity: 1; animation-timing-function: ease-out; } 25% { opacity: 1 } 35% { opacity: 0 } 100% { opacity: 0 } } Finns det någon bra lösning på det här? Hälsningar Steve!
×
×
  • Skapa nytt...