Page 1 of 2
Random image i header
Posted: Sat Nov 06, 2010 9:20 pm
by jensniko
Hej folkens
jeg er helt ny inden for cmsms.
Jeg har denne side:
akvariestedet.dk
Jeg kunne godt tænke mig ag Header billedet skifter enten ved sideskift eller automatisk efter xx sekunder.
Nogen der kan hjælpe
???
Hilsen jensniko
Re: Random image i header
Posted: Sun Nov 07, 2010 2:11 am
by webform
Prøv denne random stylesheet metode (benytter den også selv):
Beskrivelse:
Opret x antal stylesheets svarende til det antal header images du har. f.eks noget lignende:
Code: Select all
#header {
background-image: url(uploads/images/header1.jpg);
}
Navngiv hver stylesheet fortløbende f.eks. header1, header2 osv.
I din sideskabelon indsætter du følgende kode i html header området:
Code: Select all
{capture assign='cssname'}header{1|rand:x}{/capture}
{stylesheet name="$cssname" media="screen"}
{1|rand:x} x = det antal stylesheets med header images du har. Har du f.eks. 5 indsætter du tallet 5!
Nu vil et random header stylesheet blive kaldt hver gang en ny side indlæses eller reloades.
Re: Random image i header
Posted: Sun Nov 07, 2010 7:34 am
by jensniko
hej
Jeg har prøvet af følge din guide, men kan ikke få det til at funke.
Den overste kode har jeg styr på (tror jeg)
Kan du ikke uddybe hvor jeg indsætter den nederste kode?
Hilsen Jens
Re: Random image i header
Posted: Sun Nov 07, 2010 8:29 am
by maxxx
You can use "image slider" or modul Showtime!
Re: Random image i header
Posted: Mon Nov 08, 2010 4:09 pm
by webform
jensniko wrote:
Kan du ikke uddybe hvor jeg indsætter den nederste kode?
Det indsætter du mellem . Dog efter {styleheet} taggen:
Code: Select all
{stylesheet}
{capture assign='cssname'}Header{1|rand:8}{/capture}
{stylesheet name="$cssname" media="screen"}
Re: Random image i header
Posted: Mon Nov 08, 2010 4:48 pm
by jensniko
Hej
Nu har jeg prøvet at indsætte koden.
Code: Select all
{process_pagedata}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<__html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
<head>
<title>{sitename} - {title}</title>
<!--[if IE 6]><link rel="stylesheet" href="/uploads/G2/style.ie6.css" type="text/css" media="screen" /><![endif]-->
<!--[if IE 7]><link rel="stylesheet" href="/uploads/G2/style.ie7.css" type="text/css" media="screen" /><![endif]-->
<__script__ type="text/javascript" src="/uploads/G2/script.js"></__script>
{metadata}
{stylesheet}
{capture assign='cssname'}header{1|rand:9}{/capture}
{stylesheet name="$cssname" media="screen"}
</head>
</__body>
<div id="art-main">
<div class="art-sheet">
<div class="art-sheet-tl"></div>
<div class="art-sheet-tr"></div>
<div class="art-sheet-bl"></div>
<div class="art-sheet-br"></div>
<div class="art-sheet-tc"></div>
<div class="art-sheet-bc"></div>
<div class="art-sheet-cl"></div>
<div class="art-sheet-cr"></div>
Den skifter dog ikke ved side skift, hvad gør jeg galt?
Hilsen Jens
Re: Random image i header
Posted: Mon Nov 08, 2010 5:06 pm
by webform
Har du navngivet dine stylesheets header1, header2 osv?
{capture assign='cssname'}header{1|rand:9}{/capture}
(Læg mærke til at outputtet af denne vil være "header1 til header9")
Navnene på dine stylesheets skal passe sammen med hvad du capture!
Og den div id du har indsat i dine stylesheets også findes i din side skabelon?
Re: Random image i header
Posted: Mon Nov 08, 2010 5:06 pm
by jensniko
og såda ser css ud
Code: Select all
/* begin Header */
div.art-header
{
margin: 0 auto;
position: relative;
z-index: 0;
width: 992px;
height: 150px;
overflow: hidden;
}
div.art-header-jpeg
{
position: absolute;
z-index: -1;
top: 0;
left: 0;
width: 992px;
height: 150px;
background-image: url(/uploads/G2/header.jpg);
background-image: url(/uploads/G2/header1.jpg);
background-image: url(/uploads/G2/header2.jpg);
background-image: url(/uploads/G2/header3.jpg);
background-image: url(/uploads/G2/header4.jpg);
background-image: url(/uploads/G2/header5.jpg);
background-image: url(/uploads/G2/header6.jpg);
background-image: url(/uploads/G2/header7.jpg);
background-image: url(/uploads/G2/header8.jpg);
background-repeat: no-repeat;
background-position: center center;
}
/* end Header */
Re: Random image i header
Posted: Mon Nov 08, 2010 5:19 pm
by webform
Ahh! Jamen se det er også forkert
I din default stylesheet indsæt denne:
Code: Select all
div.art-header-jpeg
{
position: absolute;
z-index: -1;
top: 0;
left: 0;
width: 992px;
height: 150px;
background-image: url(/uploads/G2/header.jpg);
background-repeat: no-repeat;
background-position: center center;
}
I hver af dine "header" stylesheets indsæt denne:
Code: Select all
div.art-header-jpeg
{
background-image: url(/uploads/G2/header1.jpg);
}
OBS! I nummer 2 header stylesheet er det så header2.jpg og i header stylesheet 3 er det header3.jpg osv.
Hvis du indsætter alle background-image i samme stylesheet som du har gjort, er det kun den sidste background-image der bliver indlæst.
Det er også grunden til at jeg oplyser at du skal indsætte random kaldet efter {stylesheet} så det "overskriver" din default "background-image" du har stående i dit default stylesheet.
Grunden til at jeg skriver at du skal indsætte "background-image: url(/uploads/G2/header.jpg);" i dit default stylesheet, er at hvis det utænkelige sker og random funktionen fejler, vil der altid være et header billede til rådighed!
Re: Random image i header
Posted: Mon Nov 08, 2010 5:42 pm
by jensniko
Hmm, det er vist nu man godt kan kalde mig XXXXXXXXXXX
Code: Select all
/* begin Header */
div.art-header
{
margin: 0 auto;
position: relative;
z-index: 0;
width: 992px;
height: 150px;
overflow: hidden;
}
div.art-header-jpeg
{
position: absolute;
z-index: -1;
top: 0;
left: 0;
width: 992px;
height: 150px;
background-image: url(/uploads/G2/header1.jpg);
background-repeat: no-repeat;
background-position: center center;
}
div.art-header-jpeg
{
position: absolute;
z-index: -1;
top: 0;
left: 0;
width: 992px;
height: 150px;
background-image: url(/uploads/G2/header2.jpg);
background-repeat: no-repeat;
background-position: center center;
}
div.art-header-jpeg
{
position: absolute;
z-index: -1;
top: 0;
left: 0;
width: 992px;
height: 150px;
background-image: url(/uploads/G2/header3.jpg);
background-repeat: no-repeat;
background-position: center center;
}
/* end Header */
Og det virker SXX stadig ikke......
Re: Random image i header
Posted: Mon Nov 08, 2010 6:23 pm
by Coldman
Hoppas du förstår svenska
Försök med detta.
Code: Select all
{capture assign='num'}{1|rand:10}{/capture}
Och i din mall lägger du detta i
Code: Select all
<img src="/uploads/G2/{$num}.jpg" width='992' height='150'/>
EDIT:
Denna del {1|rand:10} skiftar mellan 1 till 10 bilder. har du färre bilder än 10 skriv då det rätta.
/Coldman
Re: Random image i header
Posted: Mon Nov 08, 2010 7:07 pm
by webform
Det ser ud til at du placerer det i samme stylesheet. Det skal være i separate stylesheets navngivet som tidligere oplyst.
Opret et nyt stylesheet og indsæt
Code: Select all
div.art-header-jpeg
{
background-image: url(/uploads/G2/header1.jpg);
}
Navngiv stylesheetet header1 og gem.
Opret et nyt stylesheet og indsæt
Code: Select all
div.art-header-jpeg
{
background-image: url(/uploads/G2/header2.jpg);
}
Navngiv stylesheetet header2 og gem.
Fortsæt som ovenstående for hver header image.
Herefter vil hver reload eller sideskift random vælge mellem de navngivne stylesheets header1 til header9.
Re: Random image i header
Posted: Mon Nov 08, 2010 7:44 pm
by jensniko
Hay Hay, Nåååå sådan.
NU virker det. Det kunne i BARE have sagt.
(GRINER)
Takker & Bukker MANGE MANGE gange......
Hilsen Jens
Re: Random image i header
Posted: Mon Nov 08, 2010 7:46 pm
by jensniko
kan det passe at siden er blevet lidt langsommere ved reload eller sideskift???
Re: Random image i header
Posted: Mon Nov 08, 2010 7:52 pm
by webform
Du har tilknyttet de forskellige Header stylesheets til din side skabelon - Det skal du ikke! Det er hvad Random koden tager sig af!