Загнутый угол на CSS

Автор Тема: Загнутый угол на CSS  (Прочитано 2371 раз)

Оффлайн DogicaАвтор темы

  • Бизнес оценка: (0)
  • Ветеран
  • *****
  • СПАСИБО: 441
  • Сообщений: 1314
  • Карма: 36
  • Пол: Мужской
  • www.dogica.com
  • Награды SEO-специалист
    • DOGICA

Оффлайн DogicaАвтор темы

  • Ветеран
  • *****
  • Доп. информация
    • Бизнес оценка: (0)
    • СПАСИБО: 441
    • Сообщений: 1314
    • Карма: 36
    • Пол: Мужской
    • www.dogica.com
    • Награды SEO-специалист
      • DOGICA
Загнутый угол на CSS
« : 12-11-2016, 16:40:00 »
Как воссоздать эффект загнутого угла страницы на CSS?
Видел ранее такую штуку.. не могу найти, может быть у кого завалялся код?

http://ruseller.com/lessons/les172/example/index.html

(в этом примере это флэш.. очень хочется его убрать с сайта окончательно - это одна из последних деталей)
DOGICA® 3D World of Dog & Puppy
HTTP://WWW.DOGICA.COM  ;)


Оффлайн wwwmaster

  • Бизнес оценка: (2, 50%)
  • Пользователь
  • **
  • СПАСИБО: 19
  • Сообщений: 56
  • Карма: 8

Оффлайн wwwmaster

  • Пользователь
  • **
Re: Загнутый угол на CSS
« Ответ #1 : 12-11-2016, 16:58:26 »
А погуглить? Или в гугле забанены? :)
Вот прямо первая ссылка в выдаче показала ответ: http://www.sitehere.ru/zaginaem-ugol-na-css3

Оффлайн tartaren

  • Бизнес оценка: (0)
  • Старожил
  • ****
  • СПАСИБО: 136
  • Сообщений: 430
  • Карма: 8
  • Награды SEO-специалист

Оффлайн tartaren

  • Старожил
  • ****
Re: Загнутый угол на CSS
« Ответ #2 : 12-11-2016, 17:08:25 »
Вот здесь несколько примеров: http://shpargalkablog.ru/2011/07/ugol-css.html

Оффлайн DogicaАвтор темы

  • Бизнес оценка: (0)
  • Ветеран
  • *****
  • СПАСИБО: 441
  • Сообщений: 1314
  • Карма: 36
  • Пол: Мужской
  • www.dogica.com
  • Награды SEO-специалист
    • DOGICA

Оффлайн DogicaАвтор темы

  • Ветеран
  • *****
  • Доп. информация
    • Бизнес оценка: (0)
    • СПАСИБО: 441
    • Сообщений: 1314
    • Карма: 36
    • Пол: Мужской
    • www.dogica.com
    • Награды SEO-специалист
      • DOGICA
Re: Загнутый угол на CSS
« Ответ #3 : 13-11-2016, 21:37:19 »
спасибо конечно за ваше время.. но вы пример смотрели?  ???
http://ruseller.com/lessons/les172/example/index.html
DOGICA® 3D World of Dog & Puppy
HTTP://WWW.DOGICA.COM  ;)

Оффлайн tartaren

  • Бизнес оценка: (0)
  • Старожил
  • ****
  • СПАСИБО: 136
  • Сообщений: 430
  • Карма: 8
  • Награды SEO-специалист

Оффлайн tartaren

  • Старожил
  • ****
Re: Загнутый угол на CSS
« Ответ #4 : 13-11-2016, 21:58:48 »
Цитировать
спасибо конечно за ваше время.. но вы пример смотрели?  ???
http://ruseller.com/lessons/les172/example/index.html
Точно такой пример мне не встречался. Можно взять за основу угол (в одном из примеров, что указал выше) и посредством CSS3 анимации добавить движения и бэкграунда на загнутую часть.


Оффлайн ВикторияИ

  • Бизнес оценка: (0)
  • КМС
  • *****
  • СПАСИБО: 3063
  • Сообщений: 4111
  • Карма: 191
  • и да прибудет с Вами Сила.
  • Награды Автор самой интересной темы Более одной тысячи спасибо КМС поисковой оптимизации
    • Заказ автобуса в Одессе
  • Доп. информация
    • Бизнес оценка: (0)
    • СПАСИБО: 3063
    • Сообщений: 4111
    • Карма: 191
    • и да прибудет с Вами Сила.
    • Награды Автор самой интересной темы Более одной тысячи спасибо КМС поисковой оптимизации
      • Заказ автобуса в Одессе
Re: Загнутый угол на CSS
« Ответ #5 : 14-11-2016, 08:02:35 »
(в этом примере это флэш.. очень хочется его убрать с сайта окончательно - это одна из последних деталей)

сделать такой эффект на голом css скорее всего не получится,- js, jquery

гляньте тут: https://www.sitepoint.com/10-jquery-page-peel-plugins/

первый вроде без flash

Оффлайн tartaren

  • Бизнес оценка: (0)
  • Старожил
  • ****
  • СПАСИБО: 136
  • Сообщений: 430
  • Карма: 8
  • Награды SEO-специалист

Оффлайн tartaren

  • Старожил
  • ****
Re: Загнутый угол на CSS
« Ответ #6 : 14-11-2016, 08:26:28 »
Вот ещё пример: https://jsfiddle.net/yurask/nd651th3/, не до конца получилось, но пытаются и думаю реально сделать как надо. Самому интересно, но сейчас некогда заниматься.

Оффлайн Fullf

  • Бизнес оценка: (0)
  • Постоялец
  • ***
  • СПАСИБО: 59
  • Сообщений: 135
  • Карма: 4
  • Пол: Мужской

Оффлайн Fullf

  • Постоялец
  • ***
Re: Загнутый угол на CSS
« Ответ #7 : 14-11-2016, 16:56:17 »
Что-то на странице руселлера пусто, но, по остальным примерам...

может это http://codepen.io/socialblogsite/pen/FphBJ

или смотрим другие варианты http://codepen.io/search/pens?q=corner&limit=all&order=popularity&depth=everything&show_forks=false
WordPress статьи - http://wordsmall.ru/

Оффлайн DogicaАвтор темы

  • Бизнес оценка: (0)
  • Ветеран
  • *****
  • СПАСИБО: 441
  • Сообщений: 1314
  • Карма: 36
  • Пол: Мужской
  • www.dogica.com
  • Награды SEO-специалист
    • DOGICA

Оффлайн DogicaАвтор темы

  • Ветеран
  • *****
  • Доп. информация
    • Бизнес оценка: (0)
    • СПАСИБО: 441
    • Сообщений: 1314
    • Карма: 36
    • Пол: Мужской
    • www.dogica.com
    • Награды SEO-специалист
      • DOGICA
Re: Загнутый угол на CSS
« Ответ #8 : 15-11-2016, 00:37:22 »
спасибо ! - то что нужно и даже в разных вариантах
буду заменять флэш.. достали эти обновления помесячные.. как винда блин
« Последнее редактирование: 15-11-2016, 00:40:16 от Dogica »
DOGICA® 3D World of Dog & Puppy
HTTP://WWW.DOGICA.COM  ;)


Оффлайн DogicaАвтор темы

  • Бизнес оценка: (0)
  • Ветеран
  • *****
  • СПАСИБО: 441
  • Сообщений: 1314
  • Карма: 36
  • Пол: Мужской
  • www.dogica.com
  • Награды SEO-специалист
    • DOGICA

Оффлайн DogicaАвтор темы

  • Ветеран
  • *****
  • Доп. информация
    • Бизнес оценка: (0)
    • СПАСИБО: 441
    • Сообщений: 1314
    • Карма: 36
    • Пол: Мужской
    • www.dogica.com
    • Награды SEO-специалист
      • DOGICA
Re: Загнутый угол на CSS
« Ответ #9 : 25-11-2016, 13:08:02 »
Повозился немножко совсем и заменил тяжелый JAVA апплет на CSSSSSS
СПАСИБО ВАМ! Эффектом доволен

Вот:

http://www.dogica.com/dog-backpack.html
DOGICA® 3D World of Dog & Puppy
HTTP://WWW.DOGICA.COM  ;)


 

Похожие темы

  Тема / Автор Ответов Последний ответ
5 Ответов
1952 Просмотров
Последний ответ 20-10-2011, 16:07:30
от endenwer