JavaScript
4 naročniki
4 naročniki
Pozdravljeni,
delam na spletni strani in kar na enkrat se je pojavila potreba po menjavi ozadja vsakih 15 sekund. Ker ne znam še programirat v javascript sem iskal po spletu rešitve in dobil rešitev, ter jo implementiral. Problem je, ko klikam po spletni strani, da se ob vsakem kliku pokaže prva slika. Ali ima kdo kakšno drugačno rešitev, ki bi si zapomnila na kateri sliki je trenutni gledalec in mu prikazala pravo sliko?
Hvala za morebitne odgovore!
4 odgovori
Boš moral uporabiti piškote. Delno lahko uporabiš to rešitev: stackoverflow.com ..
Se pravi, za vsakič ko se slika zamenja, prepišeš vrednost v piškotu. Ob vsakem nalaganju strani, pa prikažeš sliko, katere vrednost je shranjena v piškotu. Razumeš? Če še kaj ni jasno, pa kar vprašaj ;)
Na spletu sem dobil tole zadevo; super dela. Hvala za ponujeno pomoč.
To je head del:
<style type="text/css">
html, body {
height: 100%;
margin: 0;
padding: 0;
}
div.background {
position:absolute;
display:block;
left:0px;
top:0px;
bottom:0px;
right:0px;
z-index:-1;
width:auto;
height:100%;
}
div.background img {
position:absolute;
z-index:0;
left:0px;
top:0px;
width:auto;
height:100%;
}
div.background ul li.show {
z-index:500
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript">
function thebackground() {
$('div.background img').css({opacity: 0.0});
$('div.background img:first').css({opacity: 1.0});
setInterval('change()',5000);
}
function change() {
var current = ($('div.background img.show')? $('div.background img.show') : $('div.background img:first'));
if ( current.length == 0 ) current = $('div.background img:first');
var next = ((current.next().length) ? ((current.next().hasClass('show')) ? $('div.background img:first') :current.next()) :$('div.background img:first'));
next.css({opacity: 0.0})
.addClass('show')
.animate({opacity: 1.0}, 1000);
current.animate({opacity: 0.0}, 1000)
.removeClass('show');
};
$(document).ready(function() {
thebackground();
$('div.background').fadeIn(1000); // works for all the browsers other than IE
$('div.background img').fadeIn(1000); // IE tweak
});
</script>
in to je html del: (slik imam sicer več)
<div class="background">
<img src="/images/slika1.jpg" border="0" alt="pic1" />
<img src="/images/slika2.jpg" border="0" alt="pic2" />
</div>
Problem je torej shranjevanje trenutne slike, sploh mi ni jasno kateri podatek bi moral shranjevati.
Najlažje si boš pomagal s tem: jQuery cycle.
Edit: ah, šlamparija - nisem videl, da si že rešil problem. No, pa za drugič :)