kwicks

**misshellfire** · 08-09-2011, 16:44

Buongiorno,
ho scaricato il seguente template http://www.templatemonster.com/demo/34185.html
ma non riesco ad aggiungere pulsanti, ho aggiunto il codice relativo ai pulsanti nell'html ed altri dati ma non so che altro debba modificare per far funzionare il pulsante aggiunto come gli altri.

Questo è il codice html

codice:

<!DOCTYPE html>
<html lang="en">
<head>
  <title></title>
  <meta charset="utf-8">
  <link rel="stylesheet" href="css/reset.css" type="text/css" media="all">
  <link rel="stylesheet" href="css/layout.css" type="text/css" media="all">
  <link rel="stylesheet" href="css/style.css" type="text/css" media="all">
  <link rel="stylesheet" href="css/prettyPhoto.css" type="text/css" media="all">
  <script type="text/javascript" src="js/jquery-1.5.2.js" ></script>
  <script type="text/javascript" src="js/script.js"></script>
  <script type="text/javascript" src="js/pages.js"></script>
  <script type="text/javascript" src="js/kwicks-1.5.1.pack.js"></script> 
  <script type="text/javascript" src="js/jquery.prettyPhoto.js"></script>
  <script type="text/javascript" src="js/imagepreloader.js"></script>
  <script type="text/javascript">
	preloadImages([
		'images/prettyPhoto/close_active.png',
		'images/prettyPhoto/prev_active.png', 
		'images/prettyPhoto/next_active.png']);
  </script>
  <script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
  <script type="text/javascript" src="js/text-shadow.min.js"></script>
 
  <!--[if lt IE 9]>
  	<script type="text/javascript" src="js/html5.js"></script>
	<style type="text/css">
		#content figure{ behavior: url(js/PIE.htc); }
	</style>
  <![endif]-->
	<!--[if lt IE 7]>
		<div style=' clear: both; text-align:center; position: relative;'>
			
		</div>
	<![endif]-->

</head>

<body>
<div class="extra">
		<div class="main">
			
			<header>
				<h1>design studio noj</h1>
				<nav>
					<ul id="menu">
						<li id="nav1">About
						<li id="nav2">Contacts
					[/list]
				</nav>
			</header>
			
			
				<div class="overflow">
				<div class="gallery_width">
				<div class="gallery_wrap">
					<ul class="gallery horizontal">
						<li id="page_1">
							<div class="text"><span></span>Web</div>
							<ul class="cont">
								[*][img]images/album1_img1.jpg[/img][img]images/hover_img.png[/img][img]images/album1_img1.jpg[/img]
								[*][img]images/album1_img2.jpg[/img][img]images/hover_img.png[/img][img]images/album1_img2.jpg[/img]
								[*][img]images/album1_img3.jpg[/img][img]images/hover_img.png[/img][img]images/album1_img3.jpg[/img]
								[*][img]images/album1_img4.jpg[/img][img]images/hover_img.png[/img][img]images/album1_img4.jpg[/img]
								[*][img]images/album1_img5.jpg[/img][img]images/hover_img.png[/img][img]images/album1_img5.jpg[/img]
								[*][img]images/album1_img6.jpg[/img][img]images/hover_img.png[/img][img]images/album1_img6.jpg[/img]
								[*][img]images/album1_img7.jpg[/img][img]images/hover_img.png[/img][img]images/album1_img7.jpg[/img]
								[*][img]images/album1_img8.jpg[/img][img]images/hover_img.png[/img][img]images/album1_img8.jpg[/img]
								[*][img]images/album1_img9.jpg[/img][img]images/hover_img.png[/img][img]images/album1_img9.jpg[/img]
							[/list]
						
						<li id="page_2">
							<div class="text"><span></span>Print</div>
							<ul class="cont">
								[*][img]images/album2_img1.jpg[/img][img]images/hover_img.png[/img][img]images/album2_img1.jpg[/img]
								[*][img]images/album2_img2.jpg[/img][img]images/hover_img.png[/img][img]images/album2_img2.jpg[/img]
								[*][img]images/album2_img3.jpg[/img][img]images/hover_img.png[/img][img]images/album2_img3.jpg[/img]
								[*][img]images/album2_img4.jpg[/img][img]images/hover_img.png[/img][img]images/album2_img4.jpg[/img]
								[*][img]images/album2_img5.jpg[/img][img]images/hover_img.png[/img][img]images/album2_img5.jpg[/img]
								[*][img]images/album2_img6.jpg[/img][img]images/hover_img.png[/img][img]images/album2_img6.jpg[/img]
								[*][img]images/album2_img7.jpg[/img][img]images/hover_img.png[/img][img]images/album2_img7.jpg[/img]
								[*][img]images/album2_img8.jpg[/img][img]images/hover_img.png[/img][img]images/album2_img8.jpg[/img]
								[*][img]images/album2_img9.jpg[/img][img]images/hover_img.png[/img][img]images/album2_img9.jpg[/img]
							[/list]
						
						<li id="page_3">
							<div class="text"><span></span>Logo</div>
							<ul class="cont">
								[*][img]images/album3_img1.jpg[/img][img]images/hover_img.png[/img][img]images/album3_img1.jpg[/img]
								[*][img]images/album3_img2.jpg[/img][img]images/hover_img.png[/img][img]images/album3_img2.jpg[/img]
								[*][img]images/album3_img3.jpg[/img][img]images/hover_img.png[/img][img]images/album3_img3.jpg[/img]
								[*][img]images/album3_img4.jpg[/img][img]images/hover_img.png[/img][img]images/album3_img4.jpg[/img]
								[*][img]images/album3_img5.jpg[/img][img]images/hover_img.png[/img][img]images/album3_img5.jpg[/img]
								[*][img]images/album3_img6.jpg[/img][img]images/hover_img.png[/img][img]images/album3_img6.jpg[/img]
								[*][img]images/album3_img7.jpg[/img][img]images/hover_img.png[/img][img]images/album3_img7.jpg[/img]
								[*][img]images/album3_img8.jpg[/img][img]images/hover_img.png[/img][img]images/album3_img8.jpg[/img]
								[*][img]images/album3_img9.jpg[/img][img]images/hover_img.png[/img][img]images/album3_img9.jpg[/img]
							[/list]
						
						<li id="end">
							<div class="text"></div>
						
					[/list]
				</div>
				</div>
				</div>
			<section id="content">
				<article id="page_4">
					<div class="box">
						<h2>Welcome!</h2>
						

Dolore magnaorem ipsum dolor ser adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore set.sit amet consectetuer Aadipiscing elit, sed diam nonummy. nonummy nibh euismod tincidunt ut laoreet dolore magna.orem ipsum dolor ser adipiscing elit, sed diam nonummy. Dolore magnaorem ipsum dolor ser adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore set.sit amet consectetuer Aadipiscing elit, sed diam nonummy. nonummy nibh euismod tincidunt ut laoreet dolore magna.orem ipsum.</p>
						more
					</div>
				</article>
				<article id="page_5">
					<div class="box">
						<h2>Contact info</h2>
						<div class="wrapper">
							<figure><iframe width="234" height="177" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=Brooklyn,+New+York,+NY,+United+States&amp;aq=0&amp;sll=37.0625,-95.677068&amp;sspn=61.282355,146.513672&amp;ie=UTF8&amp;hq=&amp;hnear=Brooklyn,+Kings,+New+York&amp;ll=40.649974,-73.950005&amp;spn=0.01628,0.025663&amp;z=14&amp;iwloc=A&amp;output=embed"></iframe></figure>
							<div class="address">
								

8901 Marmora Road,

									Glasgow, D04 89GR.</p>
								


									     <span class="right"> +1 800 559 6580</span>Freephone:

									       <span class="right">+1 959 603 6035</span>Telephone:

									           <span class="right">+1 504 889 9898</span>FAX:    

									E-mail: mail@demolink.org</p>
							</div>
						</div>
					</div>
				</article>
				<article id="page_6">
					<div class="box">
						<h2>Privacy policy</h2>
						

Praesent  erat volutpat.</p>
						

E-mail: info@demolink.org</p>
					</div>
				</article>
				<article id="page_more">
					<div class="box">
						<h2>Read more</h2>
						

Maecenas sed diam nonummy.</p>
						

Dolore elit.</p>
					</div>
				</article>
			</section>
		</div>
		<div class="block"></div>
</div>
<div class="body1">
		<div class="main">
			
			
			<footer>
				<span class="right">Professional Website Templates Design from TemplateMonster.</span>
				Noj &copy; 2011  Privacy  Policy 
			</footer>
			
		</div>
</div>

</body>
</html>

**misshellfire** · 08-09-2011, 16:45

questo lo script.js

codice:

$(function(){
	// for lightbox
	if ($("a[rel^='prettyPhoto']").length) {
			$(document).ready(function() {
				// prettyPhoto
				$("a[rel^='prettyPhoto']").prettyPhoto({theme:'facebook'});
			});
	}
	$('.prettyPhoto').hover(function(){
			$(this).find('.img2').stop().animate({opacity:'0'});
		}, function(){
			$(this).find('.img2').stop().animate({opacity:'1'});
		}
	)
	//text shadow
	if ($.browser.msie) {
		$('h2').textShadow('0px 0px 4px #333');
		$('#menu li a > em').textShadow('0px 0px 4px #fff');
		
	};
	// button hover
	$('.button b').css({opacity:'0'});
	$('.button').hover(function(){
			$(this).find('b').stop().animate({opacity:'1'},400)
		}, function(){
			$(this).find('b').stop().animate({opacity:'0'},400)
		}
	)
});

questo pages.js

codice:

$(function(){
	function gallery_null(){
	}
	function gallery_open(){
		fl=1;
		$('body').css({minWidth:'1400px'});
		close_page();
		location.hash=page+'/';
		if (page=='page_3') {$('#page_3 .cont').css({visibility:'visible'})}
		$('.gallery_width').stop().animate({width:'1008px'},200);
	}
	function gallery_close(){
		fl=0;
		act=0;
		$('#end .text').click();
		$('#'+page+' .text span').stop().animate({opacity:'0'},400);
		$('#'+page).removeClass('active');
		location.hash='/';
		gallery_hover();
		$('.gallery_width').stop().animate({width:'516px'},400, function(){
			if (fl2) {$('body').css({minWidth:'900px'});fl2=0;}
		})
	}
	var act=0, act2=0;
	var fl=0, fl2=0, fl3=0;
	gallery_hover();
	$('.text span').css({opacity:'0'});
	$('#menu li a b').css({opacity:'0'});
	$('#content > article').css({position:'absolute'});
	$('#content .box').animate({opacity:'hide'},0);
	page=location.hash.slice(0,-1);
	if ((page!='')&&(page!='#')) {
		//gallery begin
		$('body').css({minWidth:'1400px'});
		var nav=page.substr(6);
		if ((nav>5)||(nav=='more')) {
			menu_hover()
			page=location.hash.slice(0,-1);
			open_more(page);
			nav=4;
		} else {
		if (nav>3) {
			menu_hover()
			th=$('#nav'+(nav-3)+' a');
			open_page(th);
			nav=4;
		} else {
			menu_hover()
			$(page+' .text').unbind('mouseenter, mouseleave').find('span').css({opacity:'none'});
			act=page.substr(1);
			fl=1;
		}	
		}
		$('.gallery').kwicks({
			 min : 172,
			 spacing : 0,
			 sticky : true,
			 defaultKwick:nav-1,
			 event : 'click'
		});
		
	} else {
		//gallery begin
		$('.gallery').kwicks({
		   min : 172,
		   spacing : 0,
		   sticky : true,
		   defaultKwick:3,
		   event : 'click'
		});
		$('.gallery_width').css({width:'516px'});
		$('#page_3 .cont').css({visibility:'hidden'});
		menu_hover()
	}
	function gallery_hover(){
		$('.text').mouseenter(function(){
			th=$(this).find('span');						   
			th.stop().animate({opacity:'1'},400, function(){th.css({opacity:'none'})});
		}).mouseleave( function(){
			$(this).find('span').stop().animate({opacity:'0'},400);
		})
	}
	function menu_hover(){
		$('#menu li a').mouseenter(function(){
			th=$(this).find('> b');
			th.stop().animate({opacity:'1'},400, function(){th.css({opacity:'none'})});
		}).mouseleave( function(){
			$(this).find('> b').stop().animate({opacity:'0'},400);
		})
	}
	$('.gallery > li .text').click(function(){
		page=$(this).parent().attr('id');
		if (act!=0) {$('#'+act+' .text span').stop().animate({opacity:'0'},400);}
		gallery_hover();
		if (page!='end') $(this).unbind('mouseenter, mouseleave').find('span').stop().animate({opacity:'none'},400)
		if (act!=page) {gallery_open();act=page;} else {fl2=1;gallery_close();} 
	})
	function open_content(page){
		if (page==0) {
			$('#content .box').animate({opacity:'hide'},400);
		} else {
			if (page>'#page_5') {
				$('body').css({minWidth:'1400px'});
				if (fl) {
					gallery_close();$('.text').mouseleave();
				}
			}
			if (($('#content').find(act2))&&(page!=act2)&&(act2!=0)) {
				$('#content '+act2+' .box').animate({opacity:'hide'},400, function(){
					$(page).find('.box').animate({opacity:'show'},400);
					act2=page;
				})
			} else{
				$(page).find('.box').animate({opacity:'show'},400);
				act2=page;
			}
		}
	}
	function close_page(){
		act2=0;	
		location.hash='/';
		menu_hover();
		$('#menu .active').removeClass('active').stop().animate({width:'137', marginLeft:'0', marginBottom:'0'},400, 'easeInBack', function(){
			if (fl3) {$('body').css({minWidth:'900px'});fl3=0}																																
		}).find('a > b').animate({opacity:'0'});
		open_content(0)
	}
	function open_page(th){
		if (fl) {
			gallery_close();$('.text').mouseleave();
			$('body').css({minWidth:'1400px'});
		}
		page=th.attr('href');
		open_content(page);
		$('body').css({minWidth:'1400px'});
		location.hash=page+'/';
		th.parent().addClass('active').stop().animate({width:'573', marginLeft:'-436', marginBottom:'336'},400, 'easeOutBack');	
		th.unbind('mouseenter, mouseleave').find('> b').animate({opacity:'1'},400, function(){$(this).css({opacity:'none'})});
	}
	$('#menu a').click(function(){
		if ($(this).parent().attr('class')=='active') {
			fl3=1;
			close_page();
			$(this).mouseenter();
		} else {
			page=$(this).attr('href');
			$('body').css({minWidth:'1400px'});
			if (act2==0) {
				open_content(0);
				open_page($(this));
			}
			if (page>act2) { 
				act2=0;	
				location.hash='/';
				menu_hover();
				open_content(0);
				$('#menu .active').find('a > b').animate({opacity:'0'})
				$('#menu .active').removeClass('active').stop().animate({width:'137', marginLeft:'0', marginBottom:'0'},400, 'easeInBack', function(){
					location.hash=page+'/';
					nav=page.substr(6);
					$('#nav'+(nav-3)).addClass('active').stop().animate({width:'573', marginLeft:'-436', marginBottom:'336'},400, 'easeOutBack', function(){
						open_content(page);
					});	
					$('#nav'+(nav-3)+' a').unbind('mouseenter, mouseleave').find('> b').animate({opacity:'1'},400, function(){$(this).css({opacity:'none'})});
				});
			}
			if (page<act2) { 
				act2=0;	
				open_content(0);
				location.hash='/';
				menu_hover();
				$('#menu .active').removeClass('active').stop().animate({width:'137', marginLeft:'0', marginBottom:'0'},400, 'easeInBack', function(){
					open_content(0);
					location.hash=page+'/';
					nav=page.substr(6);
					$('#nav'+(nav-3)).addClass('active').stop().animate({width:'573', marginLeft:'-436', marginBottom:'336'},400, 'easeOutBack', function(){
						open_content(page);
					});	
					$('#nav'+(nav-3)+' a').unbind('mouseenter, mouseleave').find('> b').animate({opacity:'1'},400, function(){$(this).css({opacity:'none'})});
				}).find('a > b').animate({opacity:'0'});
			}
		}
		return false
	})
	function open_more(page_cont){
		if (act2!=0) {close_page();}
		open_content(0);
		open_content(page_cont);
		location.hash=page_cont+'/';
		act2=0	
	}
	$('#content a, footer a').click(function(){
		page_cont=$(this).attr('href');
		if (page_cont.substr(page_cont.indexOf('#'),6)=='#page_') {
			open_more(page_cont);
			return false
		}
	})					  
});

**misshellfire** · 08-09-2011, 16:46

questo kwicks-1.5.1pack.js

codice:

(function($){$.fn.kwicks=function(n){var p={isVertical:false,sticky:false,defaultKwick:0,event:'mouseover',spacing:0,duration:400};
var o=$.extend(p,n);var q=(o.isVertical?'height':'width');var r=(o.isVertical?'top':'left');return this.each(function(){container=$(this);var k=container.children('li'); var l=k.eq(0).css(q).replace(/px/,'');if(!o.max){o.max=(l*k.size())-(o.min*(k.size()-1))}else{o.min=((l*k.size())-o.max)/(k.size()-1)}if(o.isVertical){container.css({width:k.eq(0).css('width'),height:(l*k.size())+(o.spacing*(k.size()-1))+'px'})}else{container.css({width:(l*k.size())+(o.spacing*(k.size()-1))+'px',height:k.eq(0).css('height')})}var m=[];for(i=0;i<k.size();i++){m[i]=[];for(j=1;j<k.size()-1;j++){if(i==j){m[i][j]=o.isVertical?j*o.min+(j*o.spacing):j*o.min+(j*o.spacing)}else{m[i][j]=(j<=i?(j*o.min):(j-1)*o.min+o.max)+(j*o.spacing)}}}k.each(function(i){var h=$(this);if(i===0){h.css(r,'0px')}else if(i==k.size()-1){h.css(o.isVertical?'bottom':'right','0px')}else{if(o.sticky){h.css(r,m[o.defaultKwick][i])}else{h.css(r,(i*l)+(i*o.spacing))}}if(o.sticky){if(o.defaultKwick==i){h.css(q,o.max+'px');h.addClass('active')}else{h.css(q,o.min+'px')}}h.css({margin:0,position:'absolute'});
																																																																																																																																																																																																																																																																																																			h.find('.text').bind(o.event,function(){var c=[];var d=[];k.stop().removeClass('active');for(j=0;j<k.size();j++){c[j]=k.eq(j).css(q).replace(/px/,'');d[j]=k.eq(j).css(r).replace(/px/,'')}var e={};e[q]=o.max;var f=o.max-c[i];var g=c[i]/f;h.addClass('active').animate(e,{step:function(a){var b=f!=0?a/f-g:1;k.each(function(j){if(j!=i){k.eq(j).css(q,c[j]-((c[j]-o.min)*b)+'px')}if(j>0&&j<k.size()-1){k.eq(j).css(r,d[j]-((d[j]-m[i][j])*b)+'px')}})},duration:o.duration,easing:o.easing}); })});
																																																																																																																																																																																if(!o.sticky){container.bind("mouseleave",function(){var c=[];var d=[];k.removeClass('active').stop();for(i=0;i<k.size();i++){c[i]=k.eq(i).css(q).replace(/px/,'');d[i]=k.eq(i).css(r).replace(/px/,'')}var e={};e[q]=l;var f=l-c[0];k.eq(0).animate(e,{step:function(a){var b=f!=0?(a-c[0])/f:1;for(i=1;i<k.size();i++){k.eq(i).css(q,c[i]-((c[i]-l)*b)+'px');if(i<k.size()-1){k.eq(i).css(r,d[i]-((d[i]-((i*l)+(i*o.spacing)))*b)+'px')}}},duration:o.duration,easing:o.easing})})}})}})(jQuery);

mentre questo il CSS

codice:

/* Getting the new tags to behave */
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video{ display: block; }
mark, rp, rt, ruby, summary, time{ display: inline }

/* Left & Right alignment */

.left { float:left;}
.right { float:right;}
.wrapper {width:100%; overflow:hidden;}

/* Global properties ======================================================== */

body{ background: url(../images/bg.gif) top left repeat; border:0; font:13px Arial, Helvetica, sans-serif; color:#787878; line-height:18px; min-width:900px}

.css3{border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px; box-shadow: 0 0 4px rgba(0, 0, 0, .4); -moz-box-shadow: 0 0 4px rgba(0, 0, 0, .4); -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, .4); position: relative;}

/* Global Structure ============================================================= */

.main { overflow:hidden; position:relative}

.body1{ background:url(../images/footer_bg.png) 0 0 repeat-x; height:50px;}
body, html {height:100%;}
.block {height:50px;}
.extra {min-height:100%; height:auto !important; height:100%; margin: 0 auto -50px; background:url(../images/bg_left_top.gif) top left no-repeat;}
/* ============================= main layout ====================== */

a{ color:#787878; text-decoration: underline; outline:none}
a:hover{ text-decoration: none}
h1{ padding:35px 0 0 37px; float:left;}
h2{ font-size:45px; color:#333333; font-weight:bold; line-height:1.2em; padding:8px 0 13px 0; letter-spacing:-2px; text-shadow:0px 0px 4px #333}
p{ padding-bottom:18px;}

/* ============================= header ====================== */
header{}

#logo{ display:block; background:url(../images/logo.png) 0 0 no-repeat; width:167px; height:121px; text-indent:-9999px;}

header nav{ float:right}

#menu { padding-top:132px; width:137px;}
#menu li { position:relative; height:67px;  width:137px; margin-top:-3px; overflow:hidden; float:right; margin-left:0}
#menu li a{ display:block; width:673px; height:67px; background:url(../images/button.png) 0 0 no-repeat; position:absolute; top:0; left:0; font-size:25px;  line-height:66px;color:#fff;text-decoration:none; letter-spacing:-1px; font-weight:bold; cursor:pointer}
#menu li a:hover, #menu #menu_active a{ }
#menu li a > b{ width:100%; height:100%; display:block; position:absolute; top:0; left:0; z-index:1;background:url(../images/button_active.png) 0 0 no-repeat} 
#menu li a > strong{ width:100%; height:100%; display:block; position:absolute; top:0; left:0; z-index:2}
#menu li a:hover > strong, #menu li.active a > strong{ background: url(../images/button_shadow.png) 0 0 no-repeat}
#menu li a > em{ font-style:normal; width:100%; height:100%; display:block; position:absolute; top:0; left:26px; z-index:3 !important; text-shadow:0px 0px 4px #fff}
#menu li a > span{z-index:2 !important}
#menu #nav2{ margin-bottom:0 !important}

/* ============================= content ====================== */

#content{  float: right; position:absolute; right:0; top:0}

#content article{ position:relative; float:right; right:50px; top:288px;}
#content #page_4{ top:220px;}
#content .box{ position:relative; width:475px; height:300px;}

#content figure{ float:left; margin-right:19px;border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px; position:relative; overflow:hidden;}

.address{ float:left; width:187px; padding-top:6px;}


.overflow{ overflow:hidden; float: left; width:auto !important; margin-left:32px; }
.gallery_width{ height:883px; width:1008px;padding-bottom:20px; position:relative; float:left; min-width:516px;}
* +html .gallery_width{ overflow:hidden}
* +html .overflow{ overflow:inherit;}
.gallery_wrap{  height:883px; width:1008px !important; min-width:516px}
.gallery{list-style: none;margin: 0;width:1008px !important;height:833px; position:relative;}
.gallery > li{ width:295px;height:883px;overflow: hidden;padding: 0;cursor:pointer; cursor:auto; float:left;}
.text{ float:left; width:172px; height:883px; text-indent:-9999px; cursor:pointer; position:relative}
#page_1 .text{ background: url(../images/album1.png) 0 0 no-repeat}
#page_2 .text{ background: url(../images/album2.png) 0 0 no-repeat}
#page_3 .text{ background: url(../images/album3.png) 0 0 no-repeat}
.text span{ width:100%; height:100%; display:block; position:absolute; top:0; left:0; z-index:1} 
.text strong{ width:100%; height:100%; display:block; position:absolute; top:0; left:0; z-index:2}
.text:hover strong, .active .text strong{ background:url(../images/albums_shadow.png) 0 0 no-repeat}
#page_1 .text span{ background: url(../images/album1_active.png) 0 0 no-repeat}
#page_2 .text span{ background: url(../images/album2_active.png) 0 0 no-repeat}
#page_3 .text span{ background: url(../images/album3_active.png) 0 0 no-repeat}

#end{ width:0px !important}

.cont{ position:absolute; left:197px; top:81px; width:450px; height:740px; overflow:hidden;}
.cont li{ float:left; padding-right:10px; padding-bottom:10px;}

.prettyPhoto{ position:relative; z-index:1; display:block}
.prettyPhoto .img1{ position:relative; padding:4px; z-index:1; width:206px; height:129px;}
.prettyPhoto .img{ position:absolute; top:0; left:0; z-index:2}
.prettyPhoto .img2{ position:absolute; top:0; left:0; z-index:3}

.button{ background: url(../images/button_more.png) 0 0 no-repeat; font-size:25px; line-height:40px; font-weight:bold;color:#fff; text-decoration:none; width:146px; display:inline-block; margin-left:-5px; height:44px; position:relative; cursor:pointer}
.button b{ width:100%; height:100%; position:absolute; top:0; left:0; background:url(../images/button_more_active.png) 0 0 no-repeat; z-index:1}
.button strong{ position:absolute; height:100%; left:22px; z-index:2}

/* ============================= footer ====================== */

footer { font:12px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#fff; text-transform:uppercase; padding:19px 39px 0}
footer a{ color:#757575; text-decoration:none}
footer a:hover{ text-decoration:underline}

/* ============================= forms ============================= */

#ContactForm {}
#ContactForm a{ margin-left:20px}
#ContactForm .input {width:200px; height:18px; border:1px solid #a4a4a4; background:#2a2a2a; padding:0 3px; margin-bottom:5px;color:#6e6e6e; text-transform:uppercase;}
#ContactForm textarea { overflow: auto}

...se ci fosse qualcuno ad indicarmi la strada...
grazie in anticipo

**misshellfire** · 09-09-2011, 15:08

sto provando in tutti i modi ma niente da fare... nella home ora sono riuscita ad aggiungere un pulsante, ma quando clicco per aprire e chiudere alla chiusura il tasto aggiunto sparisce........ uff

Discussione: kwicks

Strumenti discussione

Ricerca discussione

Visualizza

kwicks

Permessi di invio