Показать сообщение отдельно
  #2 (permalink)  
Старый 26.03.2015, 16:32
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

lemoral,
макет бы полностью ?
а так вроде нормально работает
<!DOCTYPE html>
<html>
<head>
	<title>Basic fotorama</title>
	<meta charset="utf-8">
	<meta name="viewport" content="width=720">
   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <link  href="http://cdnjs.cloudflare.com/ajax/libs/fotorama/4.5.2/fotorama.css" rel="stylesheet">
	<script src="http://cdnjs.cloudflare.com/ajax/libs/fotorama/4.5.2/fotorama.js"></script>

    <style type="text/css">
   body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  margin: 0;
-webkit-animation: bugfix infinite 1s;
}

main {
  flex: 1;
  -ms-flex-preferred-size: auto;
  background: blue;
  position: relative;
}


header{
  background-color: green;
  height: 100px;
}

footer {
background-color: red;
height: 25px;
z-index: 10000;
position: fixed;
left: 0;
bottom: 0;
padding: 10px;
background: #39b54a;
color: #fff;
 width: 100%;
}
    </style>
</head>

<body>
<main>
<div id="gallery">
<div id="container1" >
	<div class="fotorama"   data-allowfullscreen="true"
		data-nav="thumbs"
		data-thumbBorderColor="#b4193b"
		data-navPosition="bottom"
		data-fit="cover"
		data-width="100%"
        data-maxheight="100%"
		data-fitToWindowHeight="true"
		data-aspectRatio="1.5"
		data-caption="overlay"
		data-cropToFit="true"
		data-flexible="true" >
	<img src="http://s.fotorama.io/1.jpg">
	<img src="http://s.fotorama.io/2.jpg">
	<img src="http://s.fotorama.io/3.jpg">
	</div>
</div>
</div></main>
</body>
</html>
Ответить с цитированием