Выравнивание картинки

[FischeR[Sven]]

интересует такой вопрос

сегодня скачал html шаблон поставил его к себе

решил сделать slider(смена изображений) вставил код вроде всё отображается но..

картинка уходит за поле в левый бок

а с права наоборот кусок чёрный остаётся

кстати slider выдернул из dle 9.2

думаю смысла выкладывать ксс файлы другие нету смысла, но если сильно нужно выложу

сам css файл

.slider { height: 312px; position: relative; }
.slider .container { padding-bottom: 2px; background: url("../images/slidershd.png") repeat-x 50% 100%; }
#slides, .slides_container, .slider .container { height: 271px; }
.slides_container { position: relative; background: #000 url("../images/loading.gif") no-repeat 50% 50%; width: 100%; overflow: hidden; }
	.pagination { text-align: center; height: 20px; margin: 0; padding: 11px 0 0 0; list-style: none; }
		.pagination li { display: inline-block; width: 19px; height: 19px;
			zoom: 1;
			*display: inline;
		}
		.pagination li a { background: url("../images/pagination.png") no-repeat; display: block; width: 19px; padding-top: 19px; height: 0; overflow: hidden; }
			.pagination li a:hover { background-position: -19px 0; }
			.pagination li.current a { background-position: -38px 0; }

	.slider .dleft, .slider .dright { background: url("../images/slider.png") no-repeat; height: 273px; width: 23px; position: absolute; top: 0; }
		.slider .dleft { left: 0; background-position: 0 0; }	.slider .dright { right: 0; background-position: -23px 0; }

сам код который вставил

<script type="text/javascript">

	$(function(){

		$('#slides').slides({

			effect: 'fade',

			play: 5000,

			pause: 2500,

			generatePagination: true,

			preload: true,

			hoverPause: true

		});

	});

</script>

<div class="slider">


	<div class="container">

		<div id="slides">

			<div class="slides_container">

				<div><a href="#"><img src="images/slide1.jpg" alt="" /></a></div>

				<div><a href="#"><img src="images/slide2.jpg" alt="" /></a></div>

				<div><a href="#"><img src="images/slide3.jpg" alt="" /></a></div>

			</div>

		</div>

	</div>

	<div class="dleft"> </div>

	<div class="dright"> </div>	

</div>

JS Скрипт

(function($){$.fn.slides=function(option){option=$.extend({},$.fn.slides.option,option);return this.each(function(){$('.'+option.container,$(this)).children().wrapAll('<div class="slides_control"/>').children().css({display:'block'});var elem=$(this),control=$('.slides_control',elem),total=control.children().size(),width=control.children().outerWidth(),height=control.children().outerHeight(),start=option.start-1,effect=option.effect.indexOf(',')<0?option.effect:option.effect.replace(' ','').split(',')[0],paginationEffect=option.effect.indexOf(',')<0?effect:option.effect.replace(' ','').split(',')[1],next=0,prev=0,number=0,current=0,loaded,active,clicked,position,direction;i
f(total<2){return;}
if(option.start){current=start;};if(option.randomize){control.randomize();}
$('.'+option.container,elem).css({overflow:'hidden',position:'relative'});control.css({position:'relative',width:(width*3),height:height,left:-width});control.children().css({position:'absolute',top:0,left:width,zIndex:0,display:'none'});if(option.autoHeight){control.animate({height:control.children(':eq('+start+')').outerHeight()},o.autoHeightSpeed);}
if(option.preload&&control.children()[0].tagName=='IMG'){elem.css({background:'url('+option.preloadImage+') no-repeat 50% 50%'});var img=$('img:eq('+start+')',elem).attr('src')+'?'+(new Date()).getTime();$('img:eq('+start+')',elem).attr('src',img).load(function(){$(this).fadeIn(option.fadeSpeed,function(){$(this).css({zIndex:5});elem.css({background:''});loaded=true;});});}else{control.find(':eq('+start+')').fadeIn(option.fadeSpeed,function(){loaded=true;});}
if(option.bigTarget){control.children().css({cursor:'pointer'});control.children().click(function(){animate('next',effect);return false;});}
if(option.hoverPause&&option.play){control.children().bind('mouseover',function(){stop();});control.children().bind('mouseleave',function(){pause();});}
if(option.generateNextPrev){$('.'+option.container,elem).after('<a href="#" class="'+option.prev+'">Prev</a>');$('.'+option.prev,elem).after('<a href="#" class="'+option.next+'">Next</a>');}
$('.'+option.next,elem).click(function(e){e.preventDefault();if(option.play){pause();};animate('next',effect);});$('.'+option.prev,elem).click(function(e){e.preventDefault();if(option.play){pause();};animate('prev',effect);});if(option.generatePagination){elem.append('<ul class='+option.paginationClass+'></ul>');control.children().each(function(){$('.'+option.paginationClass,elem).append('<li><a rel='+number+' href="#">'+(number+1)+'</a></li>');number++;});}else{$('.'+option.paginationClass+' li a',elem).each(function(){$(this).attr('rel',number);number++;});}
$('.'+option.paginationClass+' li a:eq('+start+')',elem).parent().addClass('current');$('.'+option.paginationClass+' li a',elem).click(function(){if(option.play){pause();};clicked=$(this).attr('rel');if(current!=clicked){animate('pagination',paginationEffect,clicked);}
return false;});if(option.play){playInterval=setInterval(function(){animate('next',effect);},option.play);elem.data('interval',playInterval);};function stop(){clearInterval(elem.data('interval'));};function pause(){if(option.pause){clearTimeout(elem.data('pause'));clearInterval(elem.data('interval'));pauseTimeout=setTimeout(function(){clearTimeout(elem.data('pause'));playInterval=setInterval(function(){animate("next",effect);},option.play);elem.data('interval',playInterval);},option.pause);elem.data('pause',pauseTimeout);}else{stop();}};function animate(direction,effect,clicked){if(!active&&loaded){active=true;switch(direction){case'next':prev=current;next=current+1;next=total===next?0:next;position=width*2;direction=-width*2;current=next;break;case'prev':prev=current;next=current-1;next=next===-1?total-1:next;position=0;direction=0;current=next;break;case'pagination':next=parseInt(clicked,10);prev=$('.'+option.paginationClass+' li.current a',elem).attr('rel');if(next>prev){position=width*2;direction=-width*2;}else{position=0;direction=0;}
current=next;break;}
if(effect==='fade'){if(option.crossfade){control.children(':eq('+next+')',elem).css({zIndex:10}).fadeIn(option.fadeSpeed,function(){control.children(':eq('+prev+')',elem).css({display:'none',zIndex:0});$(this).css({zIndex:0});active=false;});}else{control.children(':eq('+prev+')',elem).fadeOut(option.fadeSpeed,function(){if(option.autoHeight){control.animate({height:control.children(':eq('+next+')',elem).outerHeight()},option.autoHeightSpeed,function(){control.children(':eq('+next+')',elem).fadeIn(elem.data('slides').fadeSpeed);});}else{control.children(':eq('+next+')',elem).fadeIn(option.fadeSpeed,function(){if($.browser.msie){$(this).get(0).style.removeAttribute('filter');}});}
active=false;});}}else{control.children(':eq('+next+')').css({left:position,display:'block'});if(option.autoHeight){control.animate({left:direction,height:control.children(':eq('+next+')').outerHeight()},option.slideSpeed,function(){control.css({left:-width});control.children(':eq('+next+')').css({left:width,zIndex:5});control.children(':eq('+prev+')').css({left:width,display:'none',zIndex:0});active=false;});}else{control.animate({left:direction},option.slideSpeed,function(){control.css({left:-width});control.children(':eq('+next+')').css({left:width,zIndex:5});control.children(':eq('+prev+')').css({left:width,display:'none',zIndex:0});active=false;});}}
if(option.pagination){$('.'+option.paginationClass+' li.current',elem).removeClass('current');$('.'+option.paginationClass+' li a:eq('+next+')',elem).parent().addClass('current');}}};});};$.fn.slides.option={preload:false,preloadImage:'/img/loading.gif',container:'slides_container',generateNextPrev:false,next:'next',prev:'prev',pagination:true,generatePagination:true,paginationClass:'pagination',fadeSpeed:350,slideSpeed:350,start:1,effect:'slide',crossfade:false,randomize:false,play:0,pause:0,hoverPause:false,autoHeight:false,autoHeightSpeed:350,bigTarget:false};$.fn.randomize=function(callback){function randomizeOrder(){return(Math.round(Math.random())-0.5);}
return($(this).each(function(){var $this=$(this);var $children=$this.children();var childCount=$children.length;if(childCount>1){$children.hide();var indices=[];for(i=0;i<childCount;i++){indices[indices.length]=i;}
indices=indices.sort(randomizeOrder);$.each(indices,function(j,k){var $child=$children.eq(k);var $clone=$child.clone(true);$clone.show().appendTo($this);if(callback!==undefined){callback($child,$clone);}
$child.remove();});}}));};})(jQuery);

ссылка на сайт ввиде IP адреса т.к. стоит дома пока что _http://95.30.201.170/

[Int]

Ну что, есть желающие разобраться в этой портянке? )

Ага, и куда там нажать чтобы картинка ездить начала?

Кстати, центральная картинка со скруглёнными краями странно смотрится при том, что скругления находятся на некотором насстоянии от края экрана, да ещё и зелёные.

А, понял, я не все адреса в noscript разрешил.

Короче, там нужно как-то под ширину экрана подгонять. Родительский див находится слева на -1267 пикселей, картинка смещается к нулю экрана, но рамка с круглыми краями находится по центру и в ширину занимает не весь экран, а только часть, поэтому скругление попадает не на край картинки, а на какую-то её часть. Тебе нужно придумать как разместить картинки тоже по центру. С текущим решением будет работать только при фиксированной ширине основной области сайта, равной ширине картинки.

Я так считаю.

[FischeR[Sven]]

дело в том что я скопировал полный код с DLE движка

а там всё ровно показано

и в чем дело я не знаю((

надумываю поставить другой slider