Донецкий техникум промышленной автоматики

Як перехоплювати клік по Flash-банеру

  1. Флешка-контейнер
  2. перекомпіляція флешки
  3. Перекриття флешки картинкою
February 9, 2011, revised February 10, 2011 ActionScript b-loader CSS Flash HTML mtasc SWF

Як не крути, Flash ще надовго залишиться з нами. Банери на Flash є найбільш наочною рекламою, і багато рекламодавців просто відмовляються працювати з іншими технологіями.

Розмістити флешку на сайті - справа нескладна. Однак, в 95% випадків очікується, що флешка буде посиланням. Думаєш, об'єкт Flash можна просто покласти в <a>? Не можна. Доводиться обмежуватися внутрішніми засобами. Флешка може бути ненажімаемой взагалі або вести на неправильний або застарілий адресу. Як показує досвід, мало хто з дизайнерів здогадується, що посилання можна передавати у флеш параметром, тому доведеться викручуватися самотужки. Як же бути?

Очевидний спосіб - відкрити флешку в Flash Professional , Перекрити її прозорим прямокутником і навісити на нього подія. Але якщо Flash Studio у нас немає, та й взяти ніде? Та й до того ж не хочеться, щоб смикали через кожної нової флешки?

Флешка-контейнер

спосіб запропонував Костя , А зробив цю флешку, як не дивно, теж дніпропетровець .

Спосіб простий, як колода: замість флешки-банера завантажується флешка-контейнер b-loader , Яка завантажує флешку-банер всередину себе і перекриває її посиланням.

<Object type = "application / x-shockwave-flash" data = "/PATH/TO/b-loader.swf" width = "SWF WIDTH" height = "SWF HEIGHT"> <param name = "movie" value = " /PATH/TO/b-loader.swf "> <param name =" FlashVars "value =" src = SWF URL & href = LINK URL "> </ object>

перекомпіляція флешки

Це рішення автоматизується, не вимагає графічного режиму, працює як з-під Windows, так і з-під Linux.

Стане в нагоді безкоштовний компілятор (рекомпілятор, точніше) ActionScript mtasc . Він є в репозиторіях Ubuntu, і, звичайно, на офіційному сайті.

Що він може? Наприклад, перекрити флешку прозорим прямокутником, навісивши на нього посилання! Для цього потрібно зберегти наступний код в файл clicker.as.

// Що робить цей код? // Створює прямокутник розміром з "сцену", тобто як весь вміст флешки, // а потім - вішає обробник на клік по цьому елементу. // Ззовні потрібно передати флешці параметр url class Clicker {static function create (): MovieClip {var clicker: MovieClip = _root. createEmptyMovieClip ( 'clicker', _root. getNextHighestDepth ()); clicker. lineStyle (1, 0x000000, 0); clicker. beginFill (0x00000, 0); clicker. lineTo (Stage. width, 0); clicker. lineTo (Stage. width, Stage. height); clicker. lineTo (0, Stage. height); clicker. lineTo (0, 0); clicker. endFill (); clicker. onRelease = function () {getURL (_root. url, "_blank"); } Return clicker; } Static function main () {var clicker = Clicker. create (); }}

а потім - "вшити" його в нашу флешку нескладної командою (яка - обережно! - затирає вихідний файл)

// syntax: bash mtasc -swf original.swf -main clicker.as

От і все! Залишається підключити флешку, наприклад, таким кросбраузерності способом:

<Object type = "application / x-shockwave-flash" data = "SWF URL" width = "SWF WIDTH" height = "SWF HEIGHT"> <param name = "movie" value = "SWF URL"> <param name = "FlashVars" value = "url = LINK URL"> </ object>

Перекриття флешки картинкою

Флешка перекривається прозорою картинкою, а на картинку вішається посилання або будь-яка подія Javascript.

За замовчуванням об'єкт Flash отрісовивается поза вікна браузера, тобто, окремим вікном, і перекрити його чим-небудь, що знаходяться в HTML, неможливо. Тому є так званий режим WMODE , Який отрісовиваєт флеш всередині браузера. Це викликає деякі проблеми з продуктивністю, проте у випадку з банерами вони нехтує малі.

Само по собі перекриття відбувається традиційним чином; blank.png - прозора картинка розміром 1x1, тобто ось така .

<Div style = "position: relative"> <object data = 'SWF URL' height = 'SWF HEIGHT' type = 'application / x-shockwave-flash "width =' SWF WIDTH '> <param name =' movie 'value = 'SWF URL' /> <param name = 'wmode' value = 'opaque' /> </ object> <a href = 'TARGET URL' style = 'position: absolute; left: 0px; top: 0px '> <img height =' 300 'src =' blank.png 'width =' 220 '/> </ a> </ div>

Можна було б перекрити просто посиланням, зробивши її блоковим елементом потрібного розміру, але це не працює в IE. Можна було б передавати картинку за допомогою data URI , Але це не працює в IE <8. Загалом, як завжди.

Сподобався пост? почастуєте кави

Думаєш, об'єкт Flash можна просто покласти в <a>?
Як же бути?
Але якщо Flash Studio у нас немає, та й взяти ніде?
Та й до того ж не хочеться, щоб смикали через кожної нової флешки?
Що він може?
Що робить цей код?
Сподобався пост?