06.10.2011, 15:47
|
|
Сам по себе
|
|
Регистрация: 09.06.2009
Сообщений: 963
|
|
Блин, а я рыбку на карусель накидал... А она, карусель, не нужна...
http://cloud001.jcase.ru/
|
|
06.10.2011, 15:48
|
Кандидат Javascript-наук
|
|
Регистрация: 16.02.2011
Сообщений: 134
|
|
Сообщение от micscr
|
А на фрилансер.ру ты обычно работаешь за отзыв, да?
|
У меня нет необходимости работать на фрилансе, у меня есть работа
Сообщение от micscr
|
Чтобы доказать что ты способен?
|
Нет, потому что как уже писал, все восприняли задачу как то глобально.
Сообщение от micscr
|
Именно благодаря таким как ты, сейчас сайты и хотят бесплатно.
|
Если сайт написан в 20 строчек, то почему бы не помочь сделать 1 такой ?
Автор темы тоже программист, а значит наш коллега. Сегодня ты коллеге помог, а завтра он тебе поможет.
|
|
06.10.2011, 15:49
|
Аспирант
|
|
Регистрация: 21.07.2011
Сообщений: 38
|
|
Serg_pnz, да не нужна. в самом начале написано, крутиться она не должна! только расположение блоков как у карусели - по кругу.
|
|
06.10.2011, 15:51
|
Аспирант
|
|
Регистрация: 21.07.2011
Сообщений: 38
|
|
Сообщение от nyols
|
Автор темы тоже программист, а значит наш коллега. Сегодня ты коллеге помог, а завтра он тебе поможет.
|
О чем и речь. Просил помощи, практически слёзно... Чем могу всегда помогаю...
|
|
06.10.2011, 15:54
|
Кандидат Javascript-наук
|
|
Регистрация: 16.02.2011
Сообщений: 134
|
|
<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
</head>
<body>
<div id="carousel">
<div class="item" style="top: 30px;left: 320px;">
<img src="http://freeimagesarchive.com/data/media/131/1_images.jpg" />
<div class="description">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam purus mauris, semper a feugiat in, ullamcorper sed enim. Aenean pretium tincidunt leo sed egestas. Phasellus viverra sem tristique odio malesuada auctor. Aenean ultricies vestibulum tortor eu convallis.</div>
</div>
<div class="item" style="top: 200px;left: 40px;">
<img src="http://www.random-images.com/image/obj21geo38pg1p5.jpg" />
<div class="description">Quisque facilisis rutrum risus, quis consectetur metus eleifend ut. Pellentesque porttitor, elit sit amet lobortis hendrerit, urna orci ultrices turpis</div>
</div>
<div class="item" style="top: 500px;left: 300px;">
<img src="http://www.nasa.gov/images/content/174735main_LEFTFullDisk.jpg" />
<div class="description">sit amet fermentum orci erat sit amet lorem. Pellentesque quis odio neque. Donec vitae diam urna, at sollicitudin nunc.</div>
</div>
<div class="item" style="top: 400px;left: 700px;">
<img src="http://www.lbto.org/images/Astronomical_Images/Holmes_V.jpg" />
<div class="description">Vestibulum posuere imperdiet molestie. Curabitur semper mauris at elit posuere vel suscipit orci vehicula. Vivamus in massa urna</div>
</div>
<div class="item" style="top: 150px;left: 650px;">
<div class="description">vitae gravida lectus. Aliquam vitae pharetra tortor. Vestibulum bibendum blandit risus, in tristique nulla rhoncus id. Nam malesuada felis felis.</div><img src="http://www.crystalxp.net/galerie/img/img-images-fractal-cloud-cebeul-8721.jpg" />
</div>
</div>
<script>
(function() {
var current = '';
$('#carousel .item').click(function() {
if (current != '') {
var top = current.data('top');
var left = current.data('left');
current.find('.description').hide();
current.animate({top: top, left: left, width: '250px', height: '150px'}, 2000, function() {
$(this).css('z-index', '1');
});
current.find('img').animate({width: '250px', height: '150px'}, 2000);
}
$(this).data('top', $(this).css('top'));
$(this).data('left', $(this).css('left'));
$(this).animate({top: '200px', left: '300px', width: '400px', height: '300px'}, 2000, function() {
$('.description', this).show();
$(this).css('z-index', '5');
});
$('img', this).animate({width: '400px', height: '300px'}, 2000);
current = $(this);
});
})();
</script>
<style>
#carousel {
position: relative;
}
.item, .item img {
width: 250px;
height: 150px;
position: absolute;
top: 0px;
left: 0px;
z-index: 1
}
.item {
position: absolute;
cursor: pointer;
}
.item .description {
z-index: 10;
position: relative;
display: none;
}
</style>
</body>
</html>
|
|
06.10.2011, 15:57
|
|
Профессор
|
|
Регистрация: 10.09.2009
Сообщений: 1,576
|
|
Цитата:
|
А из-за таких как ты, сайты становятся недоступными для небогатых слоев населения
|
понимал бы хоть что то, прежде чем говорить. Обычному человеку для него сайт доступен бесплатно, на джумле или друпале том же.
Цитата:
|
Автор темы тоже программист
|
ага, ага
|
|
06.10.2011, 16:01
|
|
CacheVar
|
|
Регистрация: 19.08.2010
Сообщений: 14,205
|
|
nyols, сделал я "Бивас, тест"...
- кликни на картинке (любой)
- потом на ней же, но увеличеной, несколько раз (ну тройку)
- потом ту же процедуру проделай с другой картинкой
И это типа готовый скрипт "на сдачу"? Он конечно мало чего стоит... Как идея - да.
Но он даже картинки по элипсу не расставляет...
|
|
06.10.2011, 16:02
|
Аспирант
|
|
Регистрация: 21.07.2011
Сообщений: 38
|
|
Сообщение от micscr
|
понимал бы хоть что то, прежде чем говорить. Обычному человеку для него сайт доступен бесплатно, на джумле или друпале том же.
ага, ага
|
ну начнем с того, что понимаю я многое, а говорю мало. Ибо лучше так, нежели чесать языком направо и налево как ты.
ага, ага... только выпендриваться не люблю.
Если автор скрипта выложит ссылку, то пожалуйста.
|
|
06.10.2011, 16:03
|
х.з
|
|
Регистрация: 21.11.2010
Сообщений: 4,588
|
|
nyols,
вас не смущает что ваш код глючный? после десятка нажатий такие глюки кидает....
да и от т.з отличается конкретно))
|
|
06.10.2011, 16:04
|
|
CacheVar
|
|
Регистрация: 19.08.2010
Сообщений: 14,205
|
|
Сообщение от dmitriymar
|
вас не смущает что ваш код глючный?
|
Там вообще все картинки можно в кучку сложить...
|
|
|
|