Як зробити ротатор банерів jquery своїми руками

Інструкція про те, як зробити ротатор банерів своїми руками, використовуючи бібліотеку jQuery. В якій вже містяться необхідні кошти анімації, а код самого ротатора буде вміщатися в кілька рядків. При цьому кожен банер буде мати свою посилання.

Щоб зробити ротатор банерів кваліфікація програміста вам не буде потрібно. Ви просто скопіювали код, замінивши в ньому деякі дані на свої, використовуючи чіткі інструкції. За допомогою власного ротатора ви зможете збільшити заробіток в CPA партнерках багаторазово:

Як зробити ротатор банерів jquery своїми руками

Наявність свого ротатора дозволило мені підвищити кликабельность банерів в кілька десятків разів, працюючи зі CPA партнеркою Admitad. Кількість банерів в ротаторі не має обмежень: в даному прикладі використовується - 3 картинки; а ефектів змінюваності - 5, їх число можна зменшити:

Спробуйте клацнути по ротаторами, кожен банер посилається на окрему сторінку. Що в ньому саме чудове? У ньому немає монотонності і звикання - саме це робить його понад клікабельним. Зміна кадрів відбувається «вроздріб» - не по порядку, з інтервалом в 4 сек. Це оптимальний інтервал, що не викликає роздратування користувачів, яке настає від частого миготіння яскравих зображень.

Для змінюваності картинок використовуються 5 ефектів, якщо ви вважаєте, що їх багато, то зможете залишити тільки потрібні. Ось вони:
  1. Горизонтальна прокрутка;
  2. Вертикальна прокрутка;
  3. Плавне заміна всіх пікселів картинки;
  4. Виростання картинки з точки;
  5. Горизонтальне обертання куба.

Перейдемо до технічної частини:

1) Щоб ротатор працював необхідно підключити бібліотеку jQuery. Для цього в тезі сторінки або всього сайту помістивши в нього такий рядок:

Це означає, що бібліотека jquery-1.6.js (всього 89.2 КБ) знаходиться в папці js вашого сайту. Підійде будь-яка інша версія jQuery-бібліотеки (не обов'язково 1.6), можливо якась вже знаходиться на вашому сайті - перевірте. Якщо немає, то ви легко знайдете її в Мережі.

2) Додайте наступний код css в тезі сторінки або в зовнішньому css-файлі (тоді без тегів