website: no screenshot previews
git-svn-id: file:///var/kolibrios-org-repos@23 ae7b2cb0-843d-483b-9e9e-b8a90ea88d30
This commit is contained in:
leency
parent
d5da67b88b
commit
297fde7229
@ -34,22 +34,6 @@
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="carousel">
|
||||
<div id="spoiler" onclick="toggle_previews()">Kolibri empty desktop</div>
|
||||
<div id="panel_minislides">
|
||||
<button onclick="previous()"></button>
|
||||
<button onclick="mini(1)" id="mslide1" class="active"></button>
|
||||
<button onclick="mini(2)" id="mslide2"></button>
|
||||
<button onclick="mini(3)" id="mslide3"></button>
|
||||
<button onclick="mini(4)" id="mslide4"></button>
|
||||
<button onclick="mini(5)" id="mslide5"></button>
|
||||
<button onclick="mini(6)" id="mslide6"></button>
|
||||
<button onclick="next()"></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="screen">
|
||||
<div id="show" onclick="next()">
|
||||
<img id='slide1' src='/i/slaid/slaid1.png' alt="Kolibri empty desktop" class='visible'>
|
||||
@ -61,5 +45,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="carousel"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -34,22 +34,6 @@
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="carousel">
|
||||
<div id="spoiler" onclick="toggle_previews()">Kolibri empty desktop</div>
|
||||
<div id="panel_minislides">
|
||||
<button onclick="previous()"></button>
|
||||
<button onclick="mini(1)" id="mslide1" class="active"></button>
|
||||
<button onclick="mini(2)" id="mslide2"></button>
|
||||
<button onclick="mini(3)" id="mslide3"></button>
|
||||
<button onclick="mini(4)" id="mslide4"></button>
|
||||
<button onclick="mini(5)" id="mslide5"></button>
|
||||
<button onclick="mini(6)" id="mslide6"></button>
|
||||
<button onclick="next()"></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="screen">
|
||||
<div id="show" onclick="next()">
|
||||
<img id='slide1' src='/i/slaid/slaid1.png' alt="Kolibri empty desktop" class='visible'>
|
||||
@ -61,5 +45,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="carousel"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -34,22 +34,6 @@
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="carousel">
|
||||
<div id="spoiler" onclick="toggle_previews()">Kolibri empty desktop</div>
|
||||
<div id="panel_minislides">
|
||||
<button onclick="previous()"></button>
|
||||
<button onclick="mini(1)" id="mslide1" class="active"></button>
|
||||
<button onclick="mini(2)" id="mslide2"></button>
|
||||
<button onclick="mini(3)" id="mslide3"></button>
|
||||
<button onclick="mini(4)" id="mslide4"></button>
|
||||
<button onclick="mini(5)" id="mslide5"></button>
|
||||
<button onclick="mini(6)" id="mslide6"></button>
|
||||
<button onclick="next()"></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="screen">
|
||||
<div id="show" onclick="next()">
|
||||
<img id='slide1' src='/i/slaid/slaid1.png' alt="Kolibri empty desktop" class='visible'>
|
||||
@ -61,5 +45,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="carousel"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -34,22 +34,6 @@
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="carousel">
|
||||
<div id="spoiler" onclick="toggle_previews()">Kolibri empty desktop</div>
|
||||
<div id="panel_minislides">
|
||||
<button onclick="previous()"></button>
|
||||
<button onclick="mini(1)" id="mslide1" class="active"></button>
|
||||
<button onclick="mini(2)" id="mslide2"></button>
|
||||
<button onclick="mini(3)" id="mslide3"></button>
|
||||
<button onclick="mini(4)" id="mslide4"></button>
|
||||
<button onclick="mini(5)" id="mslide5"></button>
|
||||
<button onclick="mini(6)" id="mslide6"></button>
|
||||
<button onclick="next()"></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="screen">
|
||||
<div id="show" onclick="next()">
|
||||
<img id='slide1' src='/i/slaid/slaid1.png' alt="Kolibri empty desktop" class='visible'>
|
||||
@ -61,5 +45,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="carousel"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 4.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 9.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 8.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 6.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 8.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 6.5 KiB |
@ -34,22 +34,6 @@
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="carousel">
|
||||
<div id="spoiler" onclick="toggle_previews()">Kolibri empty desktop</div>
|
||||
<div id="panel_minislides">
|
||||
<button onclick="previous()"></button>
|
||||
<button onclick="mini(1)" id="mslide1" class="active"></button>
|
||||
<button onclick="mini(2)" id="mslide2"></button>
|
||||
<button onclick="mini(3)" id="mslide3"></button>
|
||||
<button onclick="mini(4)" id="mslide4"></button>
|
||||
<button onclick="mini(5)" id="mslide5"></button>
|
||||
<button onclick="mini(6)" id="mslide6"></button>
|
||||
<button onclick="next()"></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="screen">
|
||||
<div id="show" onclick="next()">
|
||||
<img id='slide1' src='/i/slaid/slaid1.png' alt="Kolibri empty desktop" class='visible'>
|
||||
@ -61,5 +45,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="carousel"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -34,22 +34,6 @@
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="carousel">
|
||||
<div id="spoiler" onclick="toggle_previews()">Kolibri empty desktop</div>
|
||||
<div id="panel_minislides">
|
||||
<button onclick="previous()"></button>
|
||||
<button onclick="mini(1)" id="mslide1" class="active"></button>
|
||||
<button onclick="mini(2)" id="mslide2"></button>
|
||||
<button onclick="mini(3)" id="mslide3"></button>
|
||||
<button onclick="mini(4)" id="mslide4"></button>
|
||||
<button onclick="mini(5)" id="mslide5"></button>
|
||||
<button onclick="mini(6)" id="mslide6"></button>
|
||||
<button onclick="next()"></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="screen">
|
||||
<div id="show" onclick="next()">
|
||||
<img id='slide1' src='/i/slaid/slaid1.png' alt="Kolibri empty desktop" class='visible'>
|
||||
@ -61,5 +45,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="carousel"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -7,8 +7,8 @@
|
||||
<meta name="description" content="Галерея скриншотов Kolibri">
|
||||
<meta name="keywords" content="kolibri, kolibrios, колибри, colibri, operating system, assembler, калибри, fasm, alternate, open source">
|
||||
<meta name="viewport" content="width=device-width">
|
||||
<link rel="stylesheet" type="text/css" href="/style.css" charset="utf-8">
|
||||
<script type='text/javascript' src='/script.js'></script>
|
||||
<link rel="stylesheet" type="text/css" href="../style.css" charset="utf-8">
|
||||
<script type='text/javascript' src='../script.js'></script>
|
||||
</head>
|
||||
<body onkeydown='checkkey(event)'>
|
||||
<div id="menu">
|
||||
@ -35,29 +35,16 @@
|
||||
</div>
|
||||
|
||||
|
||||
<div id="carousel">
|
||||
<div id="spoiler" onclick="toggle_previews()">Kolibri empty desktop</div>
|
||||
<div id="panel_minislides">
|
||||
<button onclick="previous()"></button>
|
||||
<button onclick="mini(1)" id="mslide1" class="active"></button>
|
||||
<button onclick="mini(2)" id="mslide2"></button>
|
||||
<button onclick="mini(3)" id="mslide3"></button>
|
||||
<button onclick="mini(4)" id="mslide4"></button>
|
||||
<button onclick="mini(5)" id="mslide5"></button>
|
||||
<button onclick="mini(6)" id="mslide6"></button>
|
||||
<button onclick="next()"></button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="carousel"></div>
|
||||
|
||||
|
||||
<div id="screen">
|
||||
<div id="show" onclick="next()">
|
||||
<img id='slide1' src='/i/slaid/slaid1.png' alt="Чистый стол Kolibri" class='visible'>
|
||||
<img id='slide2' src='/i/slaid/slaid2.png' alt="Демки">
|
||||
<img id='slide3' src='/i/slaid/slaid3.png' alt="Файловые менеджеры">
|
||||
<img id='slide4' src='/i/slaid/slaid4.png' alt="Сетевые приложения">
|
||||
<img id='slide5' src='/i/slaid/slaid5.png' alt="Игры">
|
||||
<img id='slide6' src='/i/slaid/slaid6.png' alt="Средства разработчика">
|
||||
<div id="screen" onclick="next()">
|
||||
<div id="show" >
|
||||
<img id='slide1' src='../i/slaid/slaid1.png' alt="Чистый стол Kolibri" class='visible'>
|
||||
<img id='slide2' src='../i/slaid/slaid2.png' alt="Демки">
|
||||
<img id='slide3' src='../i/slaid/slaid3.png' alt="Файловые менеджеры">
|
||||
<img id='slide4' src='../i/slaid/slaid4.png' alt="Сетевые приложения">
|
||||
<img id='slide5' src='../i/slaid/slaid5.png' alt="Игры">
|
||||
<img id='slide6' src='../i/slaid/slaid6.png' alt="Средства разработчика">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
54
script.js
54
script.js
@ -2,8 +2,11 @@
|
||||
|
||||
var FIRST_IMG_ID = 1;
|
||||
var LAST_IMG_ID = 6;
|
||||
var current = FIRST_IMG_ID;
|
||||
var previews_visible = true;
|
||||
var current = LAST_IMG_ID;
|
||||
|
||||
window.onload = function() {
|
||||
next();
|
||||
}
|
||||
|
||||
function checkkey(e)
|
||||
{
|
||||
@ -13,60 +16,17 @@ function checkkey(e)
|
||||
else if (keycode==27) { dropdown_hide(); }
|
||||
}
|
||||
|
||||
window.onload = function() {
|
||||
if (document.getElementById("show"))
|
||||
if (document.getElementById("screen").offsetHeight < 1200) setTimeout( 'toggle_previews();', 1000);
|
||||
}
|
||||
|
||||
function next() {
|
||||
document.getElementById("mslide"+current).className = "minislide";
|
||||
document.getElementById("slide"+current).className = "minislide";
|
||||
if (current >= LAST_IMG_ID) current = FIRST_IMG_ID; else current++;
|
||||
document.getElementById("slide"+current).className = "visible";
|
||||
document.getElementById("mslide"+current).className = "minislide active";
|
||||
document.getElementById("spoiler").innerHTML = document.getElementById("slide"+current).alt;
|
||||
document.getElementById("carousel").innerHTML = document.getElementById("slide"+current).alt;
|
||||
}
|
||||
function previous() {
|
||||
document.getElementById("mslide"+current).className = "minislide";
|
||||
document.getElementById("slide"+current).className = "minislide";
|
||||
if (current <= FIRST_IMG_ID) current = LAST_IMG_ID; else current--;
|
||||
document.getElementById("slide"+current).className = "visible";
|
||||
document.getElementById("mslide"+current).className = "minislide active";
|
||||
document.getElementById("spoiler").innerHTML = document.getElementById("slide"+current).alt;
|
||||
}
|
||||
function mini(new_current) {
|
||||
document.getElementById("mslide"+current).className = "minislide";
|
||||
document.getElementById("slide"+current).className = "minislide";
|
||||
document.getElementById("slide"+new_current).className = "visible";
|
||||
document.getElementById("mslide"+new_current).className = "minislide active";
|
||||
document.getElementById("spoiler").innerHTML = document.getElementById("slide"+new_current).alt;
|
||||
current = new_current;
|
||||
}
|
||||
|
||||
function toggle_previews() {
|
||||
if (previews_visible==true)
|
||||
{
|
||||
previews_visible=false;
|
||||
hide_previews(0);
|
||||
}
|
||||
else
|
||||
{
|
||||
previews_visible = true;
|
||||
document.getElementById("panel_minislides").style.height = "auto";
|
||||
document.getElementById("spoiler").style.borderBottom = "1px #555 solid";
|
||||
}
|
||||
}
|
||||
|
||||
function hide_previews(i) {
|
||||
if (i<80) {
|
||||
document.getElementById("panel_minislides").style.height = 80 - i + "px";
|
||||
i+=3;
|
||||
setTimeout( 'hide_previews('+i+')', 1);
|
||||
}
|
||||
else
|
||||
{
|
||||
document.getElementById("spoiler").style.borderBottom = "0";
|
||||
}
|
||||
document.getElementById("carousel").innerHTML = document.getElementById("slide"+current).alt;
|
||||
}
|
||||
|
||||
|
||||
|
||||
61
style.css
61
style.css
@ -225,68 +225,23 @@ td {
|
||||
#carousel {
|
||||
position: fixed;
|
||||
bottom:0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
width: 500px;
|
||||
padding: 0 7px;
|
||||
left: calc(50% - 250px);
|
||||
border-radius: 5px 5px 0 0;
|
||||
text-align: center;
|
||||
background: #333;
|
||||
z-index:9000;
|
||||
}
|
||||
|
||||
#carousel * {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
|
||||
#panel_minislides button {
|
||||
margin: 8px 8px;
|
||||
outline: none;
|
||||
width: 84px;
|
||||
height: 64px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
border: 2px #444 solid;
|
||||
}
|
||||
|
||||
#panel_minislides button:first-child { background-image: url(/i/scroll-left.gif);border:none;width:20px;}
|
||||
#panel_minislides button:last-child { background-image: url(/i/scroll-right.gif);border:none;width:20px;}
|
||||
|
||||
#panel_minislides button:nth-child(2) {background-image: url(/i/slaid/minislaid1.png);}
|
||||
#panel_minislides button:nth-child(3) {background-image: url(/i/slaid/minislaid2.png);}
|
||||
#panel_minislides button:nth-child(4) {background-image: url(/i/slaid/minislaid3.png);}
|
||||
#panel_minislides button:nth-child(5) {background-image: url(/i/slaid/minislaid4.png);}
|
||||
#panel_minislides button:nth-child(6) {background-image: url(/i/slaid/minislaid5.png);}
|
||||
#panel_minislides button:nth-child(7) {background-image: url(/i/slaid/minislaid6.png);}
|
||||
|
||||
#panel_minislides .active {
|
||||
border-color: #fff !important;
|
||||
}
|
||||
|
||||
#spoiler {
|
||||
width:100%;
|
||||
border-bottom:1px #555 solid;
|
||||
cursor: pointer;
|
||||
background: 7px 7px no-repeat url("/i/items.png");
|
||||
color:#fff;
|
||||
text-shadow: 1px 1px 0 #111;
|
||||
}
|
||||
|
||||
#show_previews {
|
||||
position: absolute;
|
||||
left: 7px;
|
||||
top: 7px;
|
||||
color:#888;
|
||||
text-decoration:none;
|
||||
}
|
||||
|
||||
|
||||
|
||||
iframe {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/* Adaptive coding */
|
||||
|
||||
@media (max-width:864px) {
|
||||
@ -326,14 +281,6 @@ iframe {
|
||||
display: none !important;
|
||||
visibility: collapse;
|
||||
}
|
||||
#show {
|
||||
display: inline;
|
||||
margin: 0;
|
||||
display: block;
|
||||
border: none;
|
||||
overflow: visible;
|
||||
margin-top: 40px;
|
||||
}
|
||||
.download table a {
|
||||
float: left;
|
||||
display: block;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user