Пользователь пока ничего не рассказал о себе

Наибольший вклад в теги

Все теги (17)

Лучшие ответы пользователя

Все ответы (17)
  • Цикл в PHP с двумя if?

    @mr-molodoy
    if ($oid==79) {
              printf('<li><a href="http://2013.ru">%s</a></li>', $title);	
    } else if ($oid==84) {
              printf('%s', $title);
    } else {
              printf('<li><a href="/dir/%s">%s</a></li>', $oid, $title);
    }
    Ответ написан
    Комментировать
  • Как скачивать изображения с других сайтов?

    @mr-molodoy
    под "на клиенте" Вы подразумеваете браузер?

    Вроде бы как политика безопасности браузеров на сегодняшний день не позволит даже сделать кроссдоменный запрос и получить изображения, без специального заголовка со стороны сервера который Вы собираетесь "ограбить". Если я не ошибаюсь.

    Можно по след. схеме:
    Клиент <- Ваш сайта -> Сайт "жертва".

    Т.е:
    $.post('/getImages.php', {
         url: 'http://site.com/images/image.jpg'
    }, function (data) {
        // Сохраняем изображения
        // Правда признаюсь - это извращение ;)
    }, 'JSON');


    <?php
         $url = $_POST['url'];
         $filename = end('/', $url);
         $path = __DIR__ . '/images_cache/';
    
         file_put_contents($path . $filename, file_get_contents($url));
    
         json_encode([
              'image' => '/images_cache/' . $filename,
              'filename' => $filename
         ]);
    Ответ написан
    7 комментариев
  • Из чего сделан сайт Sony(http://www.sony.com/be-moved/)?

    @mr-molodoy
    Если говорить непосредственно про реализацию на этом сайте, то здесь можно увидеть анимацию canvas элемент растянутый на размер окна в котором прокручиваются кадры из анимации привязанные к scroll и управляемые через javascript.

    Если разбить весь процесс по этапам, то получим следующее:
    1. Продумать концепт.
    2. Создать наброски отдельных элементов.
    3. Смоделировать отдельные элементы по эскизам в любом 3D редакторе.
    4. Скомпоновать сцену, проработать освещение.
    5. Создать анимацию.
    6. Экспортировать в видео и разбить по кадрам либо экспортировать сцену сразу набором изображений.
    7. Оптимизировать изображения (скорее всего изображения будут обрезаться с сохранением только части изображения которое анимируется при этом статические элементы (которые на протяжении определенного времени не изменяются будут подложены как отдельное изображение на заднем)). Т.е в конечном итоге у нас получится на выходе независимых 3-4 слоя с изображениями, которые размещены на холсте друг под другом и с идеально подобранными позициями, что бы в целом картинка смотрелась целостно. Самый сложный, на мой взгляд, этап, которым можно пренебречь в прототипах и случаях когда анимация не очень долгая.
    8. На javascript пишется специальный "движек" для позиционирования слоев, подготовленных на пред. этапе и размещения на холсте (элемент canvas на странице).
    9. Пишется обработчик для события scroll в браузере, отслеживающий положение view порта относительно высоты страницы.
    10. Пишется контроллер инициализирующий обработчик события и передающий параметры прокрутки в "движек" для рендеринга нужного кадра на холсте основываясь на положение viewport'а (скролла).
    11. Помимо этого так же подготавливается css анимация для появления некоторых элементов на странице, таких как текст.
    12. кадры из CSS анимации подгоняют под кадры основной анимации внутри canvas, что бы она проходила синхронно и так же управление воспроизведением css анимацией включается в контроллер обрабатывающий анимацию в canvas.
    13. СSS анимация подключается к страницы поверх Canvas элеменета.
    14. Утверждаем работу с заказчиком.
    15. Получаем деньги и незабываем выдать зарплату всем трудящимся.
    Ответ написан
    1 комментарий
  • Как упаковать в html-файл: картинки, css и js?

    @mr-molodoy
    Доброго времени суток.
    Например стили можно не подключать а разместить в тег
    <style>
    JavaScript разместить в тег
    <script>

    Изображения в качестве фона в css можно установить след. образом:
    background-image: url(data:image/gif;base64,{{base64_content}});


    Изображения на странице можно поместить так же
    <img src="data:image/gif;base64,{{base64_content}}" alt="" />


    Шрифты в css:
    @font-face {
        font-family: 'FontName';
        src: url(data:font/truetype;charset=utf-8;base64,{{base64_content}}) format('truetype'),
             url(data:font/woff;charset=utf-8;base64,{{base64_content}}) format('woff');
    }


    Где {{base64_content}} - это картинка закодированная в base64.
    Закодировать можно здесь b64.io
    Ответ написан
    Комментировать
  • Как сделать 3 блока одинаковой высоты?

    @mr-molodoy
    Если можно пренебречь старыми браузерами, Вы легко сможете организовать это с помощью flexbox.
    Ответ написан
    Комментировать

Лучшие вопросы пользователя

Все вопросы (1)