nfsworld

Работы на конкурс Хэллоуин

Recommended Posts

Сюда выкладываем работы, присланные на конкурс Хэллоуин. Приём работ завершается 24 октября в 10:00 UTC (13 часов Киева, Минска; 14 Москвы; 16 Екатеринбурга; 17 Омска; 18 Красноярска; 19 Иркутска; 20 Якутска).

Результат вставляем в виде ссылки на сайт jsfiddle.net, ссылку прячем в тегах [ hide ] и [ /hide ] (без пробелов). Если выставляется не одна, а несколько работ, публикуйте их в одном сообщении.

Share this post


Link to post
Share on other sites

Описание:

Internet Explorer в маске Франкенштейна. Кстати, из за отсутствия вендорных префиксов на webkit и(наверное, так как выше 9 explorer’а не пробовал) ms оно отображается довольно криво, хотя у меня есть подозрения что с префиксами все равно будет не правильно.

Сама работа:

full size: http://jsfiddle.net/...mbedded/result/

small size: http://jsfiddle.net/...mbedded/result/

Share this post


Link to post
Share on other sites

Тоже поучаствую:

http://jsfiddle.net/caprella/FrdJk/

Комментарий:

Проверено в Chrome 30.0, FF 23.0.1, IE10. В FF не совсем корректно рендерится border при закругленных углах с определенными значениями border-radius (см. попу паука и белые однопиксельные полосы). Так и не смогла побороть их - буду признательна за подсказку от знающих людей. Нашла похожую проблему на stackoverflow и остановилась на том, что это может быть багом FF.

Share this post


Link to post
Share on other sites

Фото монстра:

http://jsfiddle.net/PadVonE/JNFTE/

Досье на монстра:

Крамм (Krumm, Нечупара) — как и у всех членов его семьи, глазные яблоки Крамма не прикреплены к телу и он носит их в руках, что вызывает определённые трудности, когда перед ним возникает необходимость использования обеих рук (в этом случае он помещает свои глаза в рот). Основным оружием Крамма в пугании людей является невыносимый смрад его подмышек. Крамм обладает хорошим аппетитом и страдает от боязни высоты.

Share this post


Link to post
Share on other sites

Мой не совсем монстр:

http://jsfiddle.net/...mbedded/result/

Желание сделать этого персонажа появилось уже давно, но никак руки не доходили.

Может немного не вписывается в тематику, не судите строго.

Share this post


Link to post
Share on other sites
Guest
This topic is now closed to further replies.

  • Member Statistics

    46,511
    Total Members
    3,128
    Most Online
    anasteisa
    Newest Member
    anasteisa
    Joined
  • Recently Browsing   0 members

    No registered users viewing this page.

  • Спрашивают сейчас

  • Пишут сейчас

    • Если в кратце, проблема возникает из за того что когда заходим на страницу изначально текущий урл страницы
      http://localhost:3004/tablets/tablet_1
      Если мы покликаем по табам (у которых тоже реализован роутинг и к урлу добавляется еще значение)
      То урл будет менять свое значение например на 
      http://localhost:3004/tablets/tablet_1/characteristics
      И вот, допустим у нас сейчас этот урл и если страница перезагрзиться, то реакт будет считать что текущий урл уже
      http://localhost:3004/tablets/tablet_1/characteristics
      а не 
      http://localhost:3004/tablets/tablet_1 как предполагается
      И из за этого возникают проблемы
      Могут быть вот такие страницы 
      localhost:3004/tablets/tablet_1/characteristics/characteristics А так быть не должно. Подскажите как решить такую проблему
      Если подробнее:
      Делаю Интернет-магазин на Реакте (в рамках учебного проекта)
      На данный момент сделал роуты для нескольких страниц 
      [JS]
      <Route path="/" ... /> // главная страница
      <Route path="/tablets"  ... />  // страница категорий
      <Route path="/tablets/:id"  ... /> // детальная страница товара
      [/JS]
      И это все работает хорошо Проблема с роутингом началась когда я начал делать табы на детальной странице товара. Их я тоже хотел сделать через роутинг.
      [JS]
      <Route path="/tablets/:id/characteristics"  ... />
      <Route path="/tablets/:id/opinion"  ... />
      <Route path="/tablets/:id"  ... /> // по дефолту
      [/JS]
      Пути у табов:
      [JS]
      to=`${ текущий урл страницы }/characteristics` // Таб "Характеристки"
      to=`${ текущий урл страницы }/opinion` // Таб Отзывы
      to=`${ текущий урл страницы }` // Таб "Описание" (по дефолту)
      [/JS] http://skrinshoter.ru/s/221019/1f36Q0Gw И это работает исправно, до тех пор пока страница не перезагрузиться.
      Прикол в том, что если мы кликали по табам, урл менялся и допустим стал таким : http://localhost:3004/tablets/tablet_1/characteristics
      И потом вдруг страницу перезагрузили А при перезагрузке страницы текущий адрес получается уже http://localhost:3004/tablets/tablet_1/characteristics     а не   http://localhost:3004/tablets/tablet_1     как задумывалось.     Из-за этого возникают проблемы когда кликаешь по табам:     адрес получается уже      http://localhost:3004/tablets/tablet_1/characteristics/characteristics     http://skrinshoter.ru/s/221019/eTe8ZW5F Вот в этом и проблема. Как такое решить?
      Дело в том что location.pathname я передаю через props дочернему компоненту, он принимает его и в state я добавляю ему
      [JS]`${ this.props.pathName }/characteristics`[/JS]Вот код, как это выглядит:
        class App extends Component {   render() {     <Switch>         <Route path="/" exact={true} component={ CategoriesList }/>       <Route path="/tablets/:id/characteristics"         render={ ({ match, location }) => {           const { id } = match.params;           return <DetailPage itemId={ id } currentTab="characteristics" pathName={ location.pathname } />         }}/>       <Route path="/tablets/:id/opinion"         render={ ({ match, location }) => {           const { id } = match.params;           return <DetailPage itemId={ id } currentTab="opinion" pathName={ location.pathname } />         }}/>       <Route path="/tablets/:id"         render={ ({ match, location }) => {           const { id } = match.params;           return <DetailPage itemId={ id } currentTab="description" pathName={ location.pathname } />         }}/>       <Route path="/tablets"         render={({ location }) =>           <CategoryPage             goodList={goodsList.tablets}             title="Tablets"             location={ location }             exact={true}             />}       />     </Switch>   } } class DetailPage extends Component {   state = {     tabs: {       opinion: {         tabId: 'opinionTab',         tabTitle: 'Отзывы',         tabPathTo: `${ this.props.pathName }/opinion`,         tabContent: 'Контент отзывов'       },       characteristics: {         tabId: 'characteristicsTab',         tabTitle: 'Характеристики',         tabPathTo: `${ this.props.pathName }/characteristics`,         tabContent: 'Контент Характеристик'       },       description: {         tabId: 'descriptionTab',         tabTitle: 'Описание',         tabPathTo: `${ this.props.pathName }`,         tabContent: 'Контент описания'       }     }   };   findCurrentGood(goodsList, itemId) {     for (let key in goodsList) {       goodsList[key].forEach(category => {         if (category.id === itemId) {           this.currentGood = category         }       })     }   }   findCurrentTab() {     for (let key in this.state.tabs) {       if (key === this.props.currentTab) {         this.activeTab = this.state.tabs[key];       }     }   }   render() {     const { goodsList, itemId, currentTab, pathName } = this.props;     const { tabs } = this.state;     this.findCurrentGood(goodsList, itemId);     this.findCurrentTab();               return() {       <div className="tabs">             <div className="tabs__menu">               {                 Object.keys(tabs).map(tab => {                   const tabClass = classNames('tabs__link', {                     'tabs__link--active' : tab === currentTab                   });                   return (                     <Link key={ tabs[tab].tabId }                           to={  tabs[tab].tabPathTo }                           className={ tabClass } >                       { tabs[tab].tabTitle }                     </Link>                   )                 })               }             </div>             <div className="tabs__content">               <h3 className="info__title">{ this.activeTab.tabTitle }</h3>               <div className="info__text">                 { this.activeTab.tabContent }               </div>             </div>           </div>     }   } }  
    • Создали Landing Page на тематику "Межевание земельного участка" Сделано: - С нуля разработана концепция и структура Landing page;
      - Разработан стильный и современный дизайн;
      - Наполнили контентом;
      - Качественная верстка и программирование сайта (быстрая загрузка, чистый, валидный код);
      - Подобрали хостинг и домен для клиента, установили и настроили сайт, установили админку Клиент на выходе получил полностью готовый для работы Landing Page Срок изготовления - 2 недели Если вам нужен качественно представить свою услугу, товары или компанию пишите по контактам ниже, сделаем вам крутой веб-ресурс, будь то Landing Page, Сайт многостраничник, Интернет-магазин.
      По невысокой цене и разумные сроки
      Контакты: Телеграм: @Nikker
      Скайп: smo_perviy
      E-Mail: Golllandec@gmail.com    
    • Здравствуйте. Предоставьте, пожалуйста, ссылку на сайт
  • Popular Contributors