Форум программистов
 
О проблемах, например, с регистрацией пишите сюда - alarforum@yandex.ru, проверяйте папку спам! Обязательно пройдите активизацию e-mail, а тут можно восстановить пароль.

Вернуться   Форум программистов > Web программирование > JavaScript, Ajax
Регистрация

Восстановить пароль
Повторная активизация e-mail


Ответ
 
Опции темы
Старый 02.05.2016, 12:29   #1
AlexKain
Пользователь
 
Регистрация: 25.09.2015
Сообщений: 46
По умолчанию Как сделать перекидную дату без JQuery?

Картинка с подобной датой во вложении
Изображения
Тип файла: jpg DataAnim.jpg (3.1 Кб, 123 просмотров)
AlexKain вне форума Ответить с цитированием
Старый 02.05.2016, 22:29   #2
SQLPowerUser
Форумчанин
 
Аватар для SQLPowerUser
 
Регистрация: 19.01.2015
Сообщений: 158
Вопрос Не совсем понятна задача...

Если только нарисовать такую картинку, то можно через градиент
Код HTML:
<!DOCTYPE html>
<html>
<head> <meta charset="utf-8">
<title>tmp</title>
<style>
.digit {border-collapse:collapse;}
.digit td {
  font:35px arial;
  padding:0 4px;
  border:2px solid #111;
  background-image:linear-gradient(#fff 0%, #aaa 49%, #111 50%, #111 51%, #fff 52%, #eee 75%, #aaa 100%);
}
</style>
</head>
<body>
<table class="digit">
  <tr> <td>0</td> <td>7</td> </tr>
</table>
</body>
</html>
Изображения
Тип файла: png q.PNG (848 байт, 110 просмотров)
SQLPowerUser вне форума Ответить с цитированием
Старый 03.05.2016, 12:23   #3
AlexKain
Пользователь
 
Регистрация: 25.09.2015
Сообщений: 46
По умолчанию

Нет, нарисовать-то понятно. Как сделать эффект листания, сверху вниз?
AlexKain вне форума Ответить с цитированием
Старый 03.05.2016, 12:55   #4
Пепел Феникса
Старожил
 
Аватар для Пепел Феникса
 
Регистрация: 28.01.2009
Сообщений: 21,002
По умолчанию

ну а с JQuery вы это как сделали?
Хорошо поставленный вопрос это уже половина ответа. | Каков вопрос, таков ответ.
Программа делает то что написал программист, а не то что он хотел.
Функции/утилиты ждут в параметрах то что им надо, а не то что вы хотите.
Пепел Феникса вне форума Ответить с цитированием
Старый 03.05.2016, 14:01   #5
AlexKain
Пользователь
 
Регистрация: 25.09.2015
Сообщений: 46
По умолчанию

Да никак. Я это еще не делал. Выучил HTML, CSS, JavaScript. А вот до JQuery руки не дошли. В поисковых системах на запрос вроде "как сделать эффект перелистывания цифр" все ответы начинаются так: "Берем плагин <plagin_name> JQuery"
AlexKain вне форума Ответить с цитированием
Старый 03.05.2016, 14:26   #6
Пепел Феникса
Старожил
 
Аватар для Пепел Феникса
 
Регистрация: 28.01.2009
Сообщений: 21,002
По умолчанию

по сути это называется берем готовое.
и да, JQuery это не новый язык, это библиотека на JS.
самое быстрое было бы наверно CSS анимацию прикрутить, и со scaleY эффектом поиграть.
Хорошо поставленный вопрос это уже половина ответа. | Каков вопрос, таков ответ.
Программа делает то что написал программист, а не то что он хотел.
Функции/утилиты ждут в параметрах то что им надо, а не то что вы хотите.
Пепел Феникса вне форума Ответить с цитированием
Старый 03.05.2016, 15:00   #7
AlexKain
Пользователь
 
Регистрация: 25.09.2015
Сообщений: 46
По умолчанию

Да знаю что не новый. Просто это неслабый набор функций, которые нужно выучить. Не говоря уже о том, что ради одного эффекта подключать эту немаленькую бандуру... Что касается scale эффекта. Я и сам подозреваю, что нужно свойство transform. Но есть проблема. Это свойство применяется к элементу ЦЕЛИКОМ. А в данном случае эффект перелистывания выглядит так, что верхняя половина прямоугольника загибается вниз до центра (при этом нижняя половина не меняется), а потом наоборот - разгибается вдоль нижней половины, не трогая верхнюю. Вот <a href="http://plugindetector.com/ru/flipcountdown">пример</a>. Разделить верхнюю и нижнюю половину тоже не вариант - потому что цифра находится сразу в обеих, и меняется сначала одна ее часть, затем другая

Последний раз редактировалось AlexKain; 03.05.2016 в 15:10.
AlexKain вне форума Ответить с цитированием
Старый 03.05.2016, 15:22   #8
Gorychev
Участник клуба
 
Аватар для Gorychev
 
Регистрация: 08.03.2008
Сообщений: 1,599
По умолчанию

В реальной жизни берут готовую либу и все. Все равно использование JQuery это сейчас де факто стандарт. Возможно нужно начать разбираться с ней, а не убивать время на свои велосипеды? Хорошо конечно разобраться в этом вопросе и научиться самому такое создавать.. Но, имхо, лучше потратить время на изучение на JQuery.
Gorychev вне форума Ответить с цитированием
Старый 03.05.2016, 15:26   #9
Alex11223
Заблокирован
 
Регистрация: 12.01.2011
Сообщений: 19,504
По умолчанию

Цитата:
Просто это неслабый набор функций, которые нужно выучить.
Выучить? Зачем?
Нужно просто использовать их, начиная с простых примеров в туториалах и т.п., гуглить и читать документацию по определенным функциям по необходимости.
Alex11223 вне форума Ответить с цитированием
Старый 03.05.2016, 16:05   #10
Пепел Феникса
Старожил
 
Аватар для Пепел Феникса
 
Регистрация: 28.01.2009
Сообщений: 21,002
По умолчанию

Цитата:
Разделить верхнюю и нижнюю половину тоже не вариант - потому что цифра находится сразу в обеих, и меняется сначала одна ее часть, затем другая
вполне себе вариант.
Хорошо поставленный вопрос это уже половина ответа. | Каков вопрос, таков ответ.
Программа делает то что написал программист, а не то что он хотел.
Функции/утилиты ждут в параметрах то что им надо, а не то что вы хотите.
Пепел Феникса вне форума Ответить с цитированием
Ответ

Здесь нужно купить рекламу за 20 тыс руб в месяц! ) пишите сюда - alarforum@yandex.ru
Без учёта ботов - 20000 человек в день, 350000 в месяц.

Опции темы


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
jQuery. Blur на div. Как сделать? Mr_freeman JavaScript, Ajax 2 24.01.2013 14:55
Как формировать Ajax-запрос без jQuery ? Metaron JavaScript, Ajax 1 05.03.2011 22:25
Преобразовать дату в текст без формул kipish_lp Microsoft Office Excel 8 11.05.2010 13:38
Как сделать автоматич. дату и перенос записей. Hito БД в Delphi 8 07.05.2009 12:58
открываю документ. ввожу дату и другие данные, как сделать чтобы на другой странице велась статистика по Аленка Microsoft Office Excel 5 12.02.2008 17:36


Проекты отопления, пеллетные котлы, бойлеры, радиаторы
интернет магазин respective.ru
Пеллетный котёл Emtas
котлы EMTAS
Здесь нужно купить рекламу за 7 тыс руб в месяц! )
пишите сюда - alarforum@yandex.ru
ИКС 840