50 / 40 / 5
Регистрация: 30.06.2010
Сообщений: 1,191

animate()

08.05.2011, 20:39. Показов 1427. Ответов 2
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
что у меня неправильного?
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
<html>
<head>
<title>
jquery
</title>
<script type="text/JavaScript" src="library.js"></script>
<script type="text/JavaScript">
#().ready(
function moveLeft()
{
    $('#id1').animate({'width':'150px','margin-left':'0'},1000);
});
</script>
<style>
.content
{
    margin-top:150px;
    margin-left:150px;
    border:1px dashed black;
    position:absolute;
}
.cont
{
    clear:both;
}
.but
{
    border:2px solid #cccccc;
    width:300px;
    height:200px;
    z-index:2;
    float:left;
}
.text
{
    border:2px solid #cccccc;
    margin-left:308px;
    z-index:1;
}
</style>
</head>
<body>
<div class="content">
<div class="cont">
<div class="but">
<input type="button" value="hide1" onClick="moveLeft">
</div>
<div class="text" id="id1">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. 
</div>
</div>
<br/><div class="cont">
<div class="but">
<input type="button" value="hide">
</div>
<div class="text" id="id2">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. 
</div>
</div>
<br/><div class="cont">
<div class="but">
<input type="button" value="hide">
</div>
<div class="text" id="id3">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. 
</div>
</div>
<br/><div class="cont">
<div class="but">
<input type="button" value="hide">
</div>
<div class="text" id="id4">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. 
</div>
</div>
<br/>
</div>
</body>
</html>
думаю, что, то что я хотел сделать понятно...
0
Лучшие ответы (1)
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
08.05.2011, 20:39
Ответы с готовыми решениями:

.animate();
Доброго времени суток! Никак не могу разобраться с этим эффектом. По существу: есть блок div#test, ему задана фоновая картинка. По...

Не работает animate
Доброго времени суток. Столкнулся с такой проблемой: не срабатывает эффект animate, по отношению к свойствам opacity и marginTop, в...

Toggle animate
Подскажите, как нынче работает функция toggle? С новой библиотекой jquerry вместо того, что бы к примеру панель поиска плавно открывалась в...

2
 Аватар для Vovan-VE
13210 / 6599 / 1041
Регистрация: 10.01.2008
Сообщений: 15,069
09.05.2011, 06:06
Лучший ответ Сообщение было отмечено ProstoMad как решение

Решение

Цитата Сообщение от ProstoMad Посмотреть сообщение
JavaScript
1
2
3
4
5
#().ready(
function moveLeft()
{
    $('#id1').animate({'width':'150px','margin-left':'0'},1000);
});
Что это такое? Имелось ввиду просто:
JavaScript
1
2
3
4
function moveLeft()
{
    $('#id1').animate({'width':'150px','margin-left':'0'},1000);
};
ибо:
Цитата Сообщение от ProstoMad Посмотреть сообщение
HTML5
1
<input type="button" value="hide1" onClick="moveLeft">
0
50 / 40 / 5
Регистрация: 30.06.2010
Сообщений: 1,191
09.05.2011, 10:56  [ТС]
а как можно сделать что бы при сужении блока, текст не перестраивался и, по мере залезания за див с кнопкой, скрывался?
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
09.05.2011, 10:56
Помогаю со студенческими работами здесь

Не работает animate
Вот этот код не работает, не пойму почему: &lt;script type=&quot;text/javascript&quot; src=&quot;jquery.min.js&quot;&gt;&lt;/script&gt; &lt;script...

Animate scale
Подскажите плиз, как задать начальное значение для transform scale в методе animate ? В примере ниже, анимация начинается, как если-бы...

transform and .animate()
єсть DIV с ид c_sh вот стиль к нему: #c_sh { height:100px; width:100px; left: -58px; top: 198px; transform:...

Animate не работает
Помогите пожалуйста У меня на этой странице http://dsc-pride.ru/ в хедере есть меню, при наведении на пункт которого должен перемещаться...

Метод animate
Задача такая: есть div который должен перемещаться вверх вниз влево вправо по странице. Перемещаться он должен по нажатию на кнопки на...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
3
Ответ Создать тему
Опции темы

Новые блоги и статьи
Семь CDC на одном интерфейсе: 5 U[S]ARTов, 1 CAN и 1 SSI
Eddy_Em 18.02.2026
Постепенно допиливаю свою "многоинтерфейсную плату". Выглядит вот так: https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11617&stc=1&d=1771445347 Основана на STM32F303RBT6. На борту пять. . .
Символьное дифференцирование
igorrr37 13.02.2026
/ * Программа принимает математическое выражение в виде строки и выдаёт его производную в виде строки и вычисляет значение производной при заданном х Логарифм записывается как: (x-2)log(x^2+2) -. . .
Камера Toupcam IUA500KMA
Eddy_Em 12.02.2026
Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .
И ясному Солнцу
zbw 12.02.2026
И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.
«Знание-Сила»
zbw 12.02.2026
«Знание-Сила» «Время-Деньги» «Деньги -Пуля»
SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров
8Observer8 12.02.2026
Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image)
8Observer8 11.02.2026
Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image
8Observer8 10.02.2026
Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru