Vaihtuva taustakuva
- rambe
-
Aiheen kirjoittaja
- Vieras
-
Kirjaudu tai Rekisteröidy liittyäksesi keskusteluun.
- otakar
-
- Vieras
-
Kirjaudu tai Rekisteröidy liittyäksesi keskusteluun.
- TeroKankaanpera
-
- Poissa
- Valvoja
-
- JEvents, J2Store 3 ja AdsManager kääntäjä
---
Tero Kankaanperä
terokankaanpera.fi
Kirjaudu tai Rekisteröidy liittyäksesi keskusteluun.
- naghris
-
- Vieras
-
Eli CSS:ssä laittaa oletuksena että on joku taustakuva sitten sivupohjan koodiin vaan
<?php if ($this->countModules('taustakuva')): ?>
<style type="text/css">
body{
background-image:url('templates/omatemplate/images/<jdoc:include type="modules" name="taustakuva" />')
}
</style>
<?php endif; ?>
Sitten moduli oma html, jonka sisältönä vain tuon kuvan tiedostonimi. Tämä yliajaa sivupohjan CSS-määrittely taustakuvan. Toki kuvan sijainti voi olla mitä vain
Huom: pitää varmistaa ettei moduliin tule muuta kuin se kuvan nimi, ei esim <p>-tagia
Kirjaudu tai Rekisteröidy liittyäksesi keskusteluun.
- rambe
-
Aiheen kirjoittaja
- Vieras
-
<?php $itemid = JRequest::getVar('Itemid'); ?>
<body>
<div id="page-<?php echo $itemid."-"; ?>background">
....
Ja sitten CSS:ssä määrittelen tarvittavat taustat
#page-2-background,
#page-3-background,
#page-4-background
{
position: relative;
background-image: url('../images/1.jpg');
background-repeat: no-repeat;
background-position: top left;
background-attachment: fixed;
width:100%;
min-height:100%;
min-width: 900px;
}
#page-5-background,
#page-6-background
{
position: relative;
background-image: url('../images/2.jpg');
background-repeat: no-repeat;
background-position: top left;
background-attachment: fixed;
width:100%;
min-height:100%;
min-width: 900px;
}
Aina kuin lisään menun, tsekkaan sen id:n ja laitan oikeaan tyylilistaan
vastaavasti #page-<menu_id>-background.
Samalla idealla laitetaan myös oikea header-kuva paikalleen.
Toimii ja yläpidon kannalta ihan jees.
Kirjaudu tai Rekisteröidy liittyäksesi keskusteluun.