Switch to English?
Yes
Переключитись на українську?
Так
Переключиться на русскую?
Да
Przełączyć się na polską?
Tak
Разместите свой проект бесплатно и начните получать предложения от фрилансеров-исполнителей уже спустя минуты после публикации!

Кликабельный фон на Wordpress

HTML и CSS верстка

Опубликовать похожий проект
  1. Роман Головатий
    32  
    2 дня140 UAH

    Здраствуйте, готов приступить к выполнению задания. Но заморачиватса и говорить куда писать код это долго легче скинуть копию сайта мне я все зделаю

     
  2.
    Ольга Філатова
    1107    29  0
    1 день127 UAH

    Здравствуйте, Алексей.
    Могу приступить к выполнению задания в ближайшее время.
    Стоимость - 300р.
    С уважением,
    Ольга.

     
  3.
    Роман Пелипець
    210    3  0
    1 день150 UAH

    Здравствуйте,

    Я разработчик WordPress / FrontEnd с 2-летним опытом работы, работая как инженером, так и руководителем команды на различных крупномасштабных платформах.

    Я совсем недавно перешел на фриланс, поэтому я был бы признателен, чтобы вы дали мне возможность проявить себя, несмотря на то, что мой профиль сейчас не заполнен. Я могу гарантировать вам быструю и надежную роботу, поверьте мне, вы не пожалеете.

    Жду ответа от Вас.

     
    4. Еще 4 ставки скрыты
  • Микола В.
    18 июля 2018, 23:31 |

    На джаваскрипте сгодится ?
  • Профиль удален
    18 июля 2018, 23:35 |

    Здравствуйте. По большому счету неважно, главное чтобы была возможность переодически менять картинку фона и её кликабельность (гиперссылку на ней). 
  • Микола В.
    18 июля 2018, 23:42 |

    В общем я ставку сделал, если устраивает, выбирайте и делаем через сейф.
  • Профиль удален
    19 июля 2018, 0:38 |

    на чистом css без нагрузки на сервер


    <!DOCTYPE html>

    <html><head>

    <style>

    html {

        min-height: 100%

        }

    body {

        min-height: 100%;

        margin:0;

        padding:0;

        font: 15px Tahoma;

        color:#555;

        }

    p {

    margin: 1em 0;

    text-align: center;

    }

    #top {

        width:100%;

        background: #222;

        text-align:center;

        height:35px;

        line-height:35px;

        }

    #top a {

    color:#00FF00;

    text-decoration:none;

    }

    .logo {

        width:200px;

        font: 22px/125% Tahoma;

        float:left;

        line-height:35px;

        }

    .logo span {

    font: 12px/125% Tahoma;

    }

    .body_slides {

        list-style:none;

        margin:0;

        padding:0;

        z-index:-2; 

        background:#000;

        }

    .body_slides,

    .body_slides:after {

        position: fixed;

        width:100%;

        height:100%;

        top:0px;

        left:0px;

        }

    .body_slides:after { 

        content: '';

        background: transparent url(images/pattern.png) repeat top left;

        }

    @-webkit-keyframes anim_slides {

    0% {

    opacity:0;

    }

    6% {

    opacity:1;

    }

    24% {

    opacity:1;

    }

    30% {

    opacity:0;

    }

    100% {

    opacity:0;

    }

    }

    @-moz-keyframes anim_slides {

    0% {

    opacity:0;

    }

    6% {

    opacity:1;

    }

    24% {

    opacity:1;

    }

    30% {

    opacity:0;}

    100% {

    opacity:0;

    }

    }

    .body_slides li {

        width:100%;

        height:100%;

        position:absolute;

        top:0;

        left:0;

        background-size:cover;

        background-repeat:none;

        opacity:0;

        -webkit-animation: anim_slides 18s linear infinite 0s;

        -moz-animation: anim_slides 18s linear infinite 0s;

        -o-animation: anim_slides 18s linear infinite 0s;

        -ms-animation: anim_slides 18s linear infinite 0s;

        animation: anim_slides 18s linear infinite 0s;

    }

    .body_slides li:nth-child(1) {

    background-image: url(http://russian-consumer.ru/wp-content/uploads/2017/12/37997938_-_07_04_2016_-_eqgourmet10.jpg);

    }

    .body_slides li:nth-child(2) {

    -webkit-animation-delay: 6.0s;

    -moz-animation-delay: 6.0s;

    background-image: url(https://i2.wp.com/russian-consumer.ru/wp-content/uploads/2015/03/82a028a20bc552604144ad46d38709ad_XL1.jpg?resize=350%2C230);

    }

    .body_slides li:nth-child(3) {

    -webkit-animation-delay: 12.0s;

    -moz-animation-delay: 12.0s;

    background-image: url(https://i2.wp.com/russian-consumer.ru/wp-content/uploads/2018/07/ATB_0317.jpg?resize=350%2C230);

    }

    .logo a {

    color: #fff;

    font-size: 3rem;

    }

    .logo {

    width: 100%;

    text-align: center;

    padding: 3em 0 0;

    }

    </style>


    </head>

    <body id="body">

    <ul class="body_slides">

    <li></li>

    <li></li>

    <li></li>

    </ul>

    <div class="logo"><a href="http://russian-consumer.ru/" target="_blank">RC</a></div>

    </body>

    </html>


    откройте какой-нибудь ваш текстовый редактор, допустим Блокнот, вставте это дело, и сохраните куда-нибудь на компьютер, допустим как rc.html , обязательно чтоб было .html,  откройте этот файл в браузере и посмотрите что это такое.
  • Микола В.
    19 июля 2018, 0:46 |

    1- Если хотел показать себя, то делай уже до конца. (хотя бы в кодепен засунуть это полотно и сюда запостить ссылку)

    2- В тз как бы понятно указано, что нужно кликабельным сделать фон, который замещает пространство вокруг блока с основным материалом.

       Итог. Данный код никакого отношения к тз не имеет, хоть и неплохое решение для слайдера на цсс. 
  • Профиль удален
    19 июля 2018, 0:43 |

    чтоб менять картинки в строку background-image: url(http://russian-consumer.ru/wp-content/uploads/2017/12/37997938_-_07_04_2016_-_eqgourmet10.jpg)      вместо        http://russian-consumer.ru/wp-content/uploads/2017/12/37997938_-_07_04_2016_-_eqgourmet10.jpg            , т.е. путь к картинке, вставляйте свои изображения.
  • Профиль удален
    19 июля 2018, 1:04 |

    чтобы было всё как нужно сделайте следующее. Я не знаю какой у вас доступ к вашим файлам, через хостинг, а может через ftp, скорей всего так и так. Короче, откройте в вашей теме файл functions.php, и вставте такой код 

    function background_rc(){

    $content='<ul class="body_slides"><li></li><li></li><li></li></ul>';

    return $content;

    }

    add_shortcode( 'backgroundrc, 'background_rc');

    После этого в header.php  сразу после <body <?php body_class(); ?>>   вставте  <?php echo do_shortcode('[backgroundrc]'); ?>      всё что находится между <style></style> вставте в ваш основной css файл, обычно это в самой теме style.css

    Хотя что я вам пишу, может вам это и не надо. Но по крайней мере, в отличие от js, здесь не будет никакой нагрузки на сервер.
  • Микола В.
    19 июля 2018, 1:21 |

    Но по крайней мере, в отличие от js, здесь не будет никакой нагрузки на сервер. 

    Я всегда почему то был уверен, что JS выполняется на стороне клиента, и никакой нагрузки на сервер не делает ?

        
  • Микола В.
    19 июля 2018, 1:51 |

    function background_rc(){

    $content='<ul class="body_slides"><li></li><li></li><li></li></ul>';

    return $content;

    }

    add_shortcode( 'backgroundrc, 'background_rc');

    После этого в header.php  сразу после <body <?php body_class(); ?>>   вставте  <?php echo do_shortcode('[backgroundrc]'); ?>


    Как раз этот кусок кода делает нагрузку на сервер. ( Так как написан на php)
  • Профиль удален
    19 июля 2018, 1:10 |

    слушай, грамотей, объясни ка мне дураку что такое кодепен, первый раз такой бред слышу.
  • Микола В.
    19 июля 2018, 1:15 |

    https://codepen.io/pen/
  • Микола В.
    19 июля 2018, 1:26 |

    Вот как можно было бы показать в работе свой код

     https://codepen.io/anon/pen/qyaPPy

     Все просто и наглядно, не надо ничего сохранять и создавать, все видно в браузере сразу.
  • Профиль удален
    19 июля 2018, 2:01 |

    я ошибся 

    <body id="body">

    <a href="http://russian-consumer.ru/" target="_blank" title="RC">

    <ul class="body_slides">

    <li></li>

    <li></li>

    <li></li>

    </ul></a>

    <div class="logo"><a href="" target="_blank">RC</a></div>

    </body>

    кликабельный фон
  • Профиль удален
    19 июля 2018, 3:45 |

    <!DOCTYPE html>

    <html><head>

    <style>

    .body_slides {

        list-style:none;

        margin:0;

        padding:0;

        z-index:-2; 

        background:#000;

        }

    .body_slides,

    .body_slides:after {

        position: fixed;

        width:100%;

        height:100%;

        top:0px;

        left:0px;

        }

    .body_slides:after { 

        content: '';

        background: transparent url(images/pattern.png) repeat top left;

        }

    @-webkit-keyframes anim_slides {

    0% {

    opacity:0;

    }

    6% {

    opacity:1;

    }

    24% {

    opacity:1;

    }

    30% {

    opacity:0;

    }

    100% {

    opacity:0;

    }

    }

    @-moz-keyframes anim_slides {

    0% {

    opacity:0;

    }

    6% {

    opacity:1;

    }

    24% {

    opacity:1;

    }

    30% {

    opacity:0;}

    100% {

    opacity:0;

    }

    }

    .body_slides li a {

        width:100%;

        height:100%;

        position:absolute;

        top:0;

        left:0;

        z-index: 9; 

        background-size:cover;

        background-repeat:none;

        opacity:0;

        -webkit-animation: anim_slides 18s linear infinite 0s;

        -moz-animation: anim_slides 18s linear infinite 0s;

        -o-animation: anim_slides 18s linear infinite 0s;

        -ms-animation: anim_slides 18s linear infinite 0s;

        animation: anim_slides 18s linear infinite 0s;

    }

    .body_slides li:nth-child(1) a {

    background-image: url(http://russian-consumer.ru/wp-content/uploads/2017/12/37997938_-_07_04_2016_-_eqgourmet10.jpg);

    }

    .body_slides li:nth-child(2) a {

    -webkit-animation-delay: 6.0s;

    -moz-animation-delay: 6.0s;

    background-image: url(https://i2.wp.com/russian-consumer.ru/wp-content/uploads/2015/03/82a028a20bc552604144ad46d38709ad_XL1.jpg?resize=350%2C230);

    }

    .body_slides li:nth-child(3) a {

    -webkit-animation-delay: 12.0s;

    -moz-animation-delay: 12.0s;

    background-image: url(https://i2.wp.com/russian-consumer.ru/wp-content/uploads/2018/07/ATB_0317.jpg?resize=350%2C230);

    }

    </style>


    <ul class="body_slides">

    <li><a href="http://russian-consumer.ru/" target="_blank" title="RC"></a></li>

    <li><a href="http://russian-consumer.ru/2018/07/18/%d0%bb%d0%b5%d0%bd%d1%82%d0%b0-%d0%be%d1%82%d0%ba%d0%b0%d0%b7%d0%b0%d0%bb%d0%b0%d1%81%d1%8c-%d0%be%d1%82-%d0%bf%d1%80%d0%b5%d1%82%d0%b5%d0%bd%d0%b7%d0%b8%d0%b9-%d0%ba-%d1%81%d0%b2%d0%b5/" target="_blank" title="RC"></a></li>

    <li><a href="http://russian-consumer.ru/2018/07/18/self-scanning/" target="_blank" title="RC"></a></li>

    </ul>
  • Профиль удален
    20 июля 2018, 6:52 |

    а тебе разве не объяснили что такое codepen?
  • Профиль удален
    19 июля 2018, 3:49 |

    тогда

    function background_rc(){

    $content='<ul class="body_slides">

    <li><a href="http://russian-consumer.ru/" target="_blank" title="RC"></a></li>

    <li><a href="http://russian-consumer.ru/2018/07/18/%d0%bb%d0%b5%d0%bd%d1%82%d0%b0-%d0%be%d1%82%d0%ba%d0%b0%d0%b7%d0%b0%d0%bb%d0%b0%d1%81%d1%8c-%d0%be%d1%82-%d0%bf%d1%80%d0%b5%d1%82%d0%b5%d0%bd%d0%b7%d0%b8%d0%b9-%d0%ba-%d1%81%d0%b2%d0%b5/" target="_blank" title="RC"></a></li>

    <li><a href="http://russian-consumer.ru/2018/07/18/self-scanning/" target="_blank" title="RC"></a></li>

    </ul>';

    return $content;

    }

    add_shortcode( 'backgroundrc, 'background_rc');

    После этого в header.php  сразу после <body <?php body_class(); ?>>   вставте  <?php echo do_shortcode('[backgroundrc]'); ?>

Актуальные фриланс-проекты в категории HTML и CSS верстка

Ищу программиста или вайб кодинг Автоматизация scraping данных

מחפש מתכנת או תומך בקידוד וייב. גירוד נתונים אוטומטי. https://drive.google.com/file/d/1Ogsx2iyahw79sleaDEUwMnSTPHhwF3Nu/view?usp=sharing

HTML и CSS верстка,  Веб-программирование ∙ 15 часов 7 минут назад ∙ 33 ставки

SCSS HTML JS FIGMA Верстка

1000 UAH

Нужна верстка шаблона из Figma без dev mode. Хорошо структурированный SCSS, адаптив на ваше усмотрение, все по секциям. Если используете Claude code, это большой +. Нужно еще на вчера. Указывайте цену. Нужно начать сегодня и закончить как можно быстрее (желательно завтра в…

HTML и CSS верстка ∙ 1 день 1 час назад ∙ 74 ставки

Интернет-магазин на WordPress

20 000 UAH

Нужен хороший сайт (на WordPress) интернет-магазина (продажа товаров CBD в США).Категория конкурентная, много фото/много товаров, нужно сделать оригинально. ТЗ какое-то есть. Потом нужно будет продвигать его в соц. сетях и Google.Не за все деньги мира полез, потому что реально…

HTML и CSS верстка ∙ 1 день 2 часа назад ∙ 57 ставок

Исправить CSS/DOM-верстку карточек в Chrome extension для локализации D&D Beyond

Это расширение Chrome Manifest V3, которое локализует сайт D&D Beyond на украинский язык. Проект написан на TypeScript + WXT. Расширение работает через контентный скрипт: находит английский текст на страницах D&D Beyond и заменяет его украинским переводом. Проблема возникла на…

HTML и CSS верстка,  Javascript и Typescript ∙ 1 день 10 часов назад ∙ 37 ставок

Ищу человека, который поможет наполнить сайт агентства по рекламе на Вордпрессе

Создав в кладе страницы и сейчас это все сделал на Вордпрессе. Ищу человека, который сможет помочь наполнить контентом сайт. Быстро и качественно, определенные фото, наверное, нужно будет сгенерировать в Джипити. Я постараюсь помочь. Страниц примерно 15

AI обработка текстов,  HTML и CSS верстка ∙ 2 дня 22 часа назад ∙ 40 ставок

Заказчик
Профиль удален


Проект опубликован
7 лет назад
162 просмотра