• Css Template Preview
  • Css Template Preview
  • Css Template Preview
  • Css Template Preview
  • Css Template Preview
  • What's Templatica anyway?

    Templatica is a membership based template club where you get full access to all templates in the css template gallery for a single and very affordable annual fee of $24!
    Yup, that's right! All of this plus all of the templates released within one year from the day you join. No extra cost, no hidden fees!
    You also have a possibility of purchasing a single template for as low as $5.

  • Why is the fee so low?

    I wanted to make premium templates available to as many of you as possible. Templates are not only meant for commercial but for educational purpose as well. I would like you to join, download templates, analyze the code and hopefully learn something new.
    For those who'd like to test the quality of the templates I suggest my single template purchase option.

  • What Templatica offers

    Templatica offers static design templates with valid XHTML and CSS. All templates are tested in Firefox Win, IE7, IE6, Opera on Windows as well as Safari and Firefox on Mac.
    Templates are highly customizable. The download package for each template includes HTML, CSS, JavaScript files and related images.

Usage

$(document).ready(function(){	
$("#slider").easySlider({
	controlsBefore:	'<p id="controls">',
	controlsAfter:	'</p>',
	auto: true, 
	continuous: true
});
$("#slider2").easySlider({
	controlsBefore:	'<p id="controls2">',
	controlsAfter:	'</p>',	
	prevId: 'prevBtn2',
	nextId: 'nextBtn2'	
});			
});	

CSS

#slider{}	
#slider ul, #slider li, #slider2 ul, #slider2 li{
	margin:0;
	padding:0;
	list-style:none;
	}
#slider li, #slider2 li{ 
	/* 
		define width and height of list item (slide)
		entire slider area will adjust according to the parameters provided here
	*/ 
	width:696px;
	height:241px;
	overflow:hidden; 
	}	
	
p#controls, p#controls2{
	margin:0;
	position:relative;
	} 

#prevBtn, #nextBtn, #prevBtn2, #nextBtn2{ 
	display:block;
	margin:0;
	overflow:hidden;
	text-indent:-8000px;		
	width:30px;
	height:77px;
	position:absolute;
	left:-30px;
	top:-160px;
	}	
#nextBtn, #nextBtn2{ 
	left:696px;
	}														
#prevBtn a, #nextBtn a, #prevBtn2 a, #nextBtn2 a{  
	display:block;
	width:30px;
	height:77px;
	background:url(images/btn_prev.gif) no-repeat 0 0;	
	}	
#nextBtn a, #nextBtn2 a{ 
	background:url(images/btn_next.gif) no-repeat 0 0;	
	}								
本代码由懒人建站网 收集整理
懒人建站 http://www.51xuediannao.com

懒人建站为您提供-各种bolg制作技巧,HTML技巧,CSS技巧和CMS使用技巧
懒人建站只收录实用和能提高用户体验的代码
我们只想解放出你的部分写代码时间来思考更高层次的设计,而不是要你懒惰、拼凑。