ГОЛОВОЛОМКА С ВЕСТКОЙ СЛОЕВ И ФРЕЙМОВ

Aleksandrid · December 12, 2011

Здравствуйте дорогие форумчане подскажите пожалуйста в чем мои ошибки или как можно лучше реализовать мою задумку во всех браузерах при разрешении 1024*768 все скачет при разрешении 1440*900 шапка впорядке нижние фремы все равно косячат.

необходимо чтоб вся инфа на странице была динамичной(при изменении разрешения картинки уменьшались вот как тут http://саманта74.рф/

вот код подскажите пожалуйста


<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script>
<script type="text/JavaScript" src="index/karsel/js/jquery.mousewheel.min.js"></script>
<script type="text/JavaScript" src="index/karsel/js/cc.js"></script>
<script>
// Определение браузера
IE = (document.all); // Internet Explorer?
NC = (document.layers); // Netscape?
Opera = (document.getElementById); // Opera?

function getHeight() { 
if (IE || Opera) send = document.body.clientHeight;
if (NC) send = window.innerHeight;
return send;
}

function getWidth() 
if (IE || Opera) send = document.body.clientWidth;
if (NC) send = window.innerWidth;
return send;
}
$(document).ready(function(){
	$("#carousel1").css('height',getHeight());
	$("#carousel1").css('width',getWidth());

	kH = getHeight() / 768;
	kW = getWidth() / 1024;

	$("#girl").css('left',(getWidth() / 2) - 240*kW);
	$("#girl").css('top',(getHeight() / 3) - 56*kW);
	$("#girl").css('height',261*kW);
	$("#girl").css('width',390*kW);

	$("#oblako1").css('height',100*kW);
	$("#oblako1").css('width',4*kW);
	$("#girl").css('left',(getWidth() / 2) - 40*kW);
	$("#girl").css('top',(getHeight() / 2) - 40*kW);



	$("#carousel1").CloudCarousel(		
		{			
			xPos: getWidth() / 2 - 20*kH,
			yPos: getHeight() / 2 - 50*kW,
			buttonLeft: $("#left-but"),
			buttonRight: $("#right-but"),
			altBox: $("#alt-text"),
			titleBox: $("#title-text"),
			mouseWheel:true,
			autoRotate: 'Off',
			autoRotateDelay: 10000,
			speed: 0.1,
			reflHeight: 50,
			reflOpacity:0.3,
			reflections: 0.5
		}
	);
});
</script>
 <style>
   html { overflow-x: hidden; } 
 </style>
</head>
<body bgcolor=#000000>
<table border="0" width="100%" id="table1">
	<tr>
		<td colspan="3">		
		<div id = "carousel1" style="width:600px; height:300px; background:#000;">            
		 		  <p align="center">
<iframe src="index/index_logo/index.html"  width="830" height="225" scrolling=no frameborder=0></iframe>
</p>
            <a href='http://1'> <img class = "cloudcarousel" src="index/2.png" border="0" height="94" width="150" title="Конкурсы"> </a>     
            <a href='http://1'> <img class = "cloudcarousel" src="index/2.png" border="0" height="98" width="150" title="Женское нижнее белье"> </a>          		            
            <a href='http://1'> <img class = "cloudcarousel" src="index/2.png" border="0" height="100" width="150" title="Мужское нижнее белье"> </a>         		            		            
            <a href='http://1'> <img class = "cloudcarousel" src="index/2.png" border="0" height="99" width="150"  title="Контакты"> </a>          		            
            <a href='http://1'> <img class = "cloudcarousel" src="index/2.png" border="0" height="109" width="145"  title="Партнеры"> </a>     		            
            <a href='http://1'> <img class = "cloudcarousel" src="index/2.png" border="0" height="99" width="150"  title="Доставка и оплата"> </a>    
            <a href='http://1'> <img class = "cloudcarousel" src="index/2.png" border="0" height="99" width="150"  title="Фотоотчеты" > </a>    		                                   		            

<img id="girl" src="index/girl.png" style="z-index:60; position: absolute; left:0; top:0;"/>
</div>
		<div style="display:yes;">		

        <!-- Define left and right buttons. -->
<img id="right-but" src ="index/1.png" style="background-position:right bottom; position:absolute; top:50%; margin-top:-22px; left:0; cursor:pointer; left:auto; right:0;"/>
<img id="left-but" src ="index/2.png" style="background-position:left bottom; position:absolute; top:50%; margin-top:-22px; right:0; cursor:pointer; right:auto; left:0;"/>
        </div>
<div id = "oblako1" style="position:absolute; bottom:0; width: 100%; height:10px;  background:#000;">
<p align="center">
<iframe width="400" height="160" src="index/reklama/index.htm" scrolling=no frameborder=0></iframe>	
<img border="0" src="index/lifchik.png" width="420" height="102"> 
<iframe width="400" height="160" src="index/reklama/index.htm" scrolling=no frameborder=0></iframe>	
 </p>	
</div>		
		</td>
	</tr>
	<tr>
		<td> </td>
		<td> </td>
		<td> </td>
	</tr>
	<tr>
		<td> </td>
		<td> </td>
		<td> </td>
	</tr>
</table>

</body>

</html>

psywalker · December 12, 2011

Зачем делать заголовки тем заглавными буквами?

По сабжу:

Рули в сторону медиа-запросов на CSS3 и вот думаю, для ИЕ6-8 без ЖС не обойтись.

Aleksandrid · December 13, 2011

Зачем делать заголовки тем заглавными буквами?
По сабжу:
Рули в сторону медиа-запросов на CSS3 и вот думаю, для ИЕ6-8 без ЖС не обойтись.

Заголовок там картинка вставлина)

вот с ие то в основном загвоздка!

Sign In

ГОЛОВОЛОМКА С ВЕСТКОЙ СЛОЕВ И ФРЕЙМОВ

Question

Aleksandrid

Link to comment

Share on other sites

2 answers to this question

Recommended Posts

psywalker

Link to comment

Share on other sites

Aleksandrid

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information