Vairāk piemērota gaišam dizainam.
Liec kur vēlies redzēt
Code
<script language="JavaScript" type="text/javascript" src="/slaids/js/hashslider.js"></script>
<script language="JavaScript" type="text/javascript" src="/slaids/js/jquery.mousewheel.min.js"></script>
<!-- Slaids-->
<div id="slider">
<ul>
$MYINF_SKAITLIS$
</ul>
</div>
<div id="slider_ten">
<img src="/slaids/img/shadow.png" alt="тень" />
</div>
<div id="buttons">
<div id="left"> goLeft </div>
<div id="right"> goRight </div>
</div>
<div style="clear: both;"></div>
<ul id="numbers">
<li></li>
</ul>
<!-- /Slaids -->
<style>/* Pamats
------------------------------------------*/
#slider {
position: relative;
width: 400px; height: 200px;
border: 1px solid #999;
overflow: hidden;
margin: 75px auto 0 auto;
z-index: 10;
}
#slider ul {
position: relative;
margin:0px;
padding:0px;
}
#slider ul li {
float: left;
list-style-type: none;
}
/* Enas augstums un platums zem slaidera
------------------------------------------*/
#slider_ten {
position: relative;
width: 400px;
height: 35px;
margin: auto auto;
z-index: 10;
}
/* Virziena uzstādijumi
------------------------------------------*/
#buttons {
position: relative;
width: 500px; height: 40px;
margin: -100px auto;
z-index: 100;
}
#right {
width: 105px; height: 40px;
background-image: url(/slaids/img/next_button.png);
text-indent: -99999px;
float: right;
cursor: pointer;
}
#left {
width: 105px; height: 40px;
background-image: url(/slaids/img/back_button.png);
text-indent: -99999px;
float: left;
cursor: pointer;
}
/* Punkti
------------------------------------------*/
#numbers {
height: auto;
margin: 35px auto;
text-align: center;
}
#numbers li {
position: relative;
width: 18px; height: 13px;
background-image: url(/slaids/img/dot_sprite.png);
background-repeat: no-repeat;
float: left;
margin: 0 0px 5px 0;
cursor: pointer;
text-indent: -99999px;
z-index: 100;
list-style-type: none;
}
.activenum {
background-position: 0 -13px;
}</style>
Lejuplādējam pielikuma failu. Saglabājam saturu failu menidžerī mapē slaids ar visām tur esošajām apakšmapēm un saturu tajās.
Tad izveido informeri
Code
<li>
<a href="$ENTRY_URL$" target="_blank"><?if($IMG_URL1$)?><img src="$IMG_URL1$"height="200" width="400"><?else><?if($IMG_URL1$)?><img src="$IMG_URL1$"height="200" width="400"><?endif?><?endif?></a>
</li>
Pielikumā ir arī psd faili kur varēsi << Un >> vietā tekstu vai ko citu izveidot.
Iznākums
LEJUPLADET >