| |
|
|
| | Здравствуйте, подскажите пож-ста в какую сторону копать.
есть слой PANORAMA (overflow:hidden), в нем превьюшки картинок.
есть две кнопки, при наведении на которых прокручивается верх и вниз слой.
нарыл такие функции
<script type="text/javascript">
var Timer;
function ScrollTop() {
Timer = setInterval("document.getElementById('PANORAMA').scrollTop -= 12", 15);
}
function ScrollBottom() {
Timer = setInterval("document.getElementById('PANORAMA').scrollTop += 12", 15);
}
</script>
Слой прокручивается до конца или до начала и останавливается
Мне надо сделать чтобы за последними картинками шли первый и наоборот соответсвенно (Бесконечность одиноких темных лестниц.. блин( ).
я так понимаю что этот слой надо как то динамически создавать добавляя картинки..
подскажите пожс-ста в какую сторону копать,
я про javascript только по телевизору слышал.
Заранее благодарен | |
| |
|
|
| |
|
|
| |
для: Vadym
(17.05.2008 в 11:23)
| | | А где у вас тут слой вообще??? Слоёв в HTML В ПРИНЦИПЕ не существует. Зачем спрашивать о том, чего не бывает??? И коды ваши просто никакие - оно просто устанавливают таймеры и НИЧЕГО больше не делают. | |
| |
|
|
| |
|
|
| |
для: coloboc66
(18.05.2008 в 23:09)
| | | <div id="PANORAMA">картинки</div>
этот слой таскается двумя верхними функциями | |
| |
|
|
| |
|
|
| |
для: Vadym
(17.05.2008 в 11:23)
| | |
<html><head>
<style>
div.dud {width: 80px; padding: 5px 0; background-color: silver; text-align: center; cursor: default}
img.mini {width: 80px; height: 50px; position: relative}
#PANORAMA {width: 80px; height: 234px; overflow: hidden}
</style>
<script>
var N = 2, K = 0;
function f ()
{
var o = document.getElementById ('PANORAMA');
var s = o.childNodes;
if (N == 0)
{
if (K != -50) {K--; for (var j = 0; j < s.length; j++) s [j].style.top = K + 'px'}
else
{
var n = s [0].cloneNode (1); o.appendChild (n); o.removeChild (s [0]);
for (var z = o.childNodes, j = 0; j < z.length; j++) z [j].style.top = '0px'; K = 0;
}
}
if (N == 1)
{
if (K != 0) {K++; for (var j = 0; j < s.length; j++) s [j].style.top = K + 'px'}
else
{
for (var n = new Array (), j = 0; j < s.length; j++) n [j] = s [j].cloneNode (1);
o.replaceChild (n [n.length - 1], s [0]);
for (var j = 1; j < s.length; j++) o.replaceChild (n [j - 1], s [j]);
for (var z = o.childNodes, j = 0; j < z.length; j++) z [j].style.top = '-50px'; K = -50;
}
}
if (N < 2) setTimeout (f, 100);
}
</script>
</head>
<body>
<div class="dud" style="margin-bottom: 4px" onmouseover="if (N) {N = 0; f ()}">Up</div>
<div id="PANORAMA"
><img class="mini" onmouseover="N=2" style="background-color: red" alt="каждый"
><img class="mini" onmouseover="N=2" style="background-color: orange" alt="охотник"
><img class="mini" onmouseover="N=2" style="background-color: yellow" alt="желает"
><img class="mini" onmouseover="N=2" style="background-color: green" alt="знать"
><img class="mini" onmouseover="N=2" style="background-color: aqua" alt="где"
><img class="mini" onmouseover="N=2" style="background-color: blue" alt="сидит"
><img class="mini" onmouseover="N=2" style="background-color: violet" alt="фазан"
></div>
<div class="dud" style="margin-top: 4px" onmouseover="if (N != 1) {N = 1; f ()}">Down</div>
</body>
</html>
|
* Все картинки (теги <IMG>) должны иметь одинаковую высоту
** Высота контейнера PANORAMA должна быть не больше суммарной высоты всех картинок минус высота одной картинки. В примере картинок всего 7 штук, каждая из которых имеет высоту 50 пикселов; суммарная высота = 350 пикселов. Контейнер в данном случае может иметь высоту не более 300 пикселов (в примере - 234 пиксела).
*** Слитное написание >< внутри контейнера - обязательно!
**** Понятное дело, что на каждом из тегов <IMG> должны быть ещё и инструкции для события onclick, дающие возможность показать где-то увеличенное изображение выбранной картинки. Полагаю, что это у вас есть. | |
| |
|
|
| |
|
|
| |
для: PAT
(19.05.2008 в 15:47)
| | | Огромное спасибо | |
| |
|
|
