jQueryプラグインのLityで青い枠線を消したい

jQueryプラグインのLityでYou Tubeの動画をポップアップ表示にしました。
その際、画像をクリックでポップアップする表示にしましたが、動画を閉じると画像の周りに青い枠線が出来てしまします。

Lityの紹介サイトですが、
https://on-ze.com/demo/jquery-lity/
このサイトではLityのポップアップ表示後も枠線はありませんが、
https://y-hilite.com/example/htdocs/popup01/
こちらのサイトでは私と同じ青い枠線が出ています。
border="0"等色々試してますが消えません。
どうしたら消すことが出来るでしょうか。
なお、動画のポップアップの際にLightBoxでロールオーバーイメージにしています。

発生している問題・エラーメッセージ

青い枠線が出る

該当のソースコード

<td width="440" height="240"><p align="center" class="style28"><a href="https://www.youtube.com/embed/xxxxxxxx?color=white&rel=0" onMouseOver="MM_swapImage('Image21','','img/xxxxxxx.jpg',1)" onMouseOut="MM_swapImgRestore()" data-lity="data-lity"><img src="img/xxxxxxxx.jpg" {
    border-style:none;
} alt="xxxxxxxx" width="560" height="315" id="Image21" border="0" /></a></p></td>

試したこと

色々な場所にborder="0"を配置してみた

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

行動規範の内容に同意します

回答1件

ベストアンサー

こんにちは。

質問者さまご自身がお作りになっているページでうまくいくかは分かりませんが、ご質問にある「該当のソースコード」の <a>タグに以下のCSSを効かせてみるといかがでしょうか？

css
1outline: none;

簡単に試してみるなら、<a> に直接 style属性を以下のように追加します。

html
1<a style="outline: none;" href="https://www.youtube.com/embed/xxxxxxxx?color=white&rel=0" ・・・ >

　
なお検証として、ご質問に挙げられている https://y-hilite.com/example/htdocs/popup01/を表示し、ディベロッパーツールから <a>に上記スタイルを効かせることによって、動画を閉じた後も枠線が表示されなくなったのを確認できました。(使用ブラウザ： Mac用Chrome v68)

参考になれば幸いです。

投稿2018/08/22 18:05

編集2018/08/22 18:36