Справка по вращающемуся рекламному баннеру

Little Mike

Я хочу создать вращающийся баннер, используя Javascript.

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

Я хотел бы, чтобы баннер был 728x90. Я хотел бы иметь файлы изображений и ссылок в файле javascript, чтобы, если его необходимо изменить, это можно было бы легко сделать, не просматривая 100 html-страниц.

Пока это то, что у меня есть, но у меня все еще есть некоторые проблемы.

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

Я просто заполнил http-ссылки в качестве примера, я просто использовал исходные страницы моего сайта для тестового запуска.

С другой стороны, изображения являются источником файлов.

Изображение не хочет отображаться, однако поле есть.

И когда я нажимаю на поле, он говорит, что по этому адресу не существует файла...

 .advertisement {

height: 90px;

width: 728px;

float: center;
}

HTML:

 document.getElementById("ad-link").setAttribute("href", "[URL='https://lumtu.com/yti/duVVudDFodHRwOi8vYWR2ZXJ0aXNlbWVudHNwYWNlZm9ycmy9m']http://advertisementspaceforrent1[/URL], [URL='https://lumtu.com/yti/duVVudDJodHRwOi8vYWR2ZXJ0aXNlbWVudHNwYWNlZm9ycmy9m']http://advertisementspaceforrent2[/URL]"); document.getElementById("ad-img").setAttribute("src", "images/advertisementspaceforrent1.png, images/advertisementspaceforrent1.png"); setTimeout(function() { //update banner }, 5000);

Код (JavaScript):

 <a id="ad-link" href="url to advertisements homepage" > <img class="advertisement" id="ad-img" src="url to image"> </a>

Код (CSS):

Андрей Николаевич

... и даже если они это делают, они используют то, что Дэн Шульц называл «CMS для бедняков», где у вас, по крайней мере, есть PHP или какой-либо другой серверный язык, склеивающий части, которые повторно используются на страницах, так что вы только приходится редактировать такие вещи, как меню или заголовки, в одном месте.

На самом деле это звучит так, будто ОП просто хочет скопировать код вместо того, чтобы изучать, как он работает, и это помешает их усилиям по выполнению чего-либо; что, учитывая обломки кода, которые они опубликовали.

да.

Sawyer2

Поскольку вы уже ищете решение запроса, я полагаю, вы можете сделать что-то вроде этого. Работает со всеми размерами баннеров:
Демо: http://jsfiddle.net/xDZPK/151/

HTML:

 


<script type="text/javascript" src="[URL='https://lumtu.com/yti/a4SS4anNodHRwOi8vY29kZS5qcXVlcnkuY29tL2pxdWVyeS0xLjkuMkjL']http://code.jquery.com/jquery-1.9.1.js[/URL]"></script>


<script>


$(document).ready(function(){


$("#slider a").first().show();


var index = 0;


var count = 5;


function bannerRotator() {


$('#slider a').delay(4300).eq(index).fadeOut(function() {


if (index === count){


index = -1;


}


$('#slider a').eq(index + 1).fadeIn(function() {


index++;


bannerRotator();


});


});


}


bannerRotator();


});


</script>

Код (разметка): CSS:

  #slider a{ display: none; }

Код (разметка): JS:

  <div id="slider"> <a href="#"> <img src="[URL='https://lumtu.com/yti/ZAZZAZTFodHRwOi8vcGxhY2Vob2xkLml0LzcyOXg5MGFtcDt0ZXh0U2xp2U0']http://placehold.it/729x90&text=Slide+1"/[/URL]> </a> <a href="#"> <img src="[URL='https://lumtu.com/yti/ZQWWQZTJodHRwOi8vcGxhY2Vob2xkLml0LzMwMHgyNTBhbXA7dGV4dFNsaNFd']http://placehold.it/300x250&text=Slide+2"/[/URL]> </a> <a href="#"> <img src="[URL='https://lumtu.com/yti/ZAZZAZTNodHRwOi8vcGxhY2Vob2xkLml0LzcyOXg5MGFtcDt0ZXh0U2xp2U0']http://placehold.it/729x90&text=Slide+3"/[/URL]> </a> <a href="#"> <img src="[URL='https://lumtu.com/yti/ZQWWQZTRodHRwOi8vcGxhY2Vob2xkLml0LzI1MHgyNTBhbXA7dGV4dFNsaNFd']http://placehold.it/250x250&text=Slide+4"/[/URL]> </a> <a href="#"> <img src="[URL='https://lumtu.com/yti/ZAZZAZTVodHRwOi8vcGxhY2Vob2xkLml0LzQ2OHg2MGFtcDt0ZXh0U2xp2U0']http://placehold.it/468x60&text=Slide+5"/[/URL]> </a> <a href="#"> <img src="[URL='https://lumtu.com/yti/ZQWWQZTZodHRwOi8vcGxhY2Vob2xkLml0LzIwMHgyMDBhbXA7dGV4dFNsaNFd']http://placehold.it/200x200&text=Slide+6"/[/URL]> </a> </div>

Код (разметка):

alexgreen888

Суть в следующем: ПРЕЖДЕ ЧЕМ начнешь что-то делать, ты читаешь, получаешь понимание, что тебе предстоит делать.

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

То же самое должно быть и с веб-разработкой — вы пытаетесь понять, какие инструменты у вас есть и что вы можете сделать, чтобы упростить процесс.

И да - в настоящее время никто не создает страницы вручную - слишком много обновлять и изменять, если вам нужно изменить один элемент, повторяющийся на всех страницах - кроме того, в этих файлах МНОГО дублированного кода.

Если вы используете подходящую CMS или даже созданную самостоятельно, у вас будет несколько файлов, таких как index.php, обрабатывающих весь контент, извлекающих информацию из базы данных и, возможно, несколько других файлов, включаемых в зависимости от того, что вы хотите на странице - например, для контактных форм и тому подобного может потребоваться отдельный закодированный файл, но он все равно будет включен и не будет содержать окружающий код - он просто содержит конкретный код, необходимый для работы функции.

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

Это избавит вас от многих хлопот, и у вас будет гораздо меньше проблем с обновлением всего сайта.

Alex_D20

Вы можете использовать то, что я предложил, или даже свой собственный скрипт (при условии, что он исправлен и работает), но вам нужно сделать это через включаемые файлы. Смешно, что у вас 100 страниц и КАЖДУЮ ИЗ НИХ нужно обновлять вручную. Никто этого не делает.

smaiLika

Вот почему у вас есть своего рода CMS для анализа контента — следовательно, вы вносите изменения в ОДИН файл (ну, возможно, в два, если вы хотите разделить скрипт и список изображений/баннеров) и просто включаете этот файл в заголовок.

Вам никогда не придется прикасаться к другим страницам (почему они вообще существуют? Управляемые базой данных, так и должно быть).

BeликийHexoчyxa

Так что ты определенно меня немного потерял, лол. Я новичок в HTML-кодировании и лишь кратко занимался Javascript. Итак, я могу использовать то, что опубликовал qwikad??? Как бы мне это сделать???

MaZa_Mladwii

На этих форумах я нахожу столько сарказма, но никто не хочет предоставить мне нужную информацию. Вы не можете забыть, что в какой-то момент вы тоже находились на этапе обучения, и вам приходилось задавать вопросы, чтобы учиться.

Похожие темы	Дата
[Udemy] Mark Tan - Создание Telegram ботов с помощью JavaScript: Полное руководство (2019)	19.10.2024, 18:10
[lynda.com] Javascript События [rus]	19.10.2024, 18:10
[SmartMe] JavaScript. Функциональное программирование	19.10.2024, 18:10
Javascript advanced	19.10.2024, 18:10
Налоги в зависимости от государства	19.10.2024, 18:10
Пример панели для подписи для новичков	19.10.2024, 18:10
Преобразование масштаба с помощью JQuery/CSS – но для печати	19.10.2024, 18:10
Форматирование отметки времени для скрытого поля в форме	19.10.2024, 18:10
jQuery Close() Remove() на не работает?	19.10.2024, 18:10
[CBS] Javascript Advanced	19.10.2024, 18:10

Справка по вращающемуся рекламному баннеру

Little Mike

Андрей Николаевич

Sawyer2

alexgreen888

Alex_D20

smaiLika

BeликийHexoчyxa

MaZa_Mladwii

I AM

Интересно