忍者ブログ
インフォメーション
< 10月 2024年11月 12月 >
1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
RSS
yuz_ブログ  >> 

僕の毎日を、思い出として書き残す。
何一つ役立つものはないが・・・

YouTube動画をポップアップで再生するテスト
幾つか試しに動画を貼り付けてみた。
画像をクリックすると、ポップアップで動画再生が始まるはず。

動画再生中でもページをスクロール出来るが、ポップアップは固定されて移動しない。
スクロールして、他の画像をクリックすると動画が入れ替わって再生されると思う。

一番下の画像がデフォルトで、YouTubeの埋め込みコードをそのまま貼り付けたもの。
埋め込みコードを元にサムネイルが自動で表示され、クリックするとポップアップ再生する。

ブラウザのサイズを変えると、ポップアップの大きさも変化する。
ただし、再生中にはサイズが追従しない。
もう一度、サムネイルをクリックすれば新たなサイズに変わるはずなのだが・・・

追記:2015/12/23 10:00 ーーーーーーーーーー

閉じるボタンをクリックした時に枠線が見えたので、対策を考えた。
IEで気付かなかったが、Firefoxとクロムで見たら枠線が出ていた。
とりあえず、outline:none; で見えなくなったが・・・
なんとも、あたり前の事だったような気がしてつまらない。


次は


その次は


そのその次は


そのそのその次は


そのそのそのその次は


これでもう良いかな

テスト終了

追記:
この動画は僕じゃないが・・・


これで、ほんとうに終わり。

拍手[2回]

コメント : おはようございます
あれ?なんかエンター押しちゃったかな?
エンターで送信しちゃったみたいで誤送信です
すいませんでした、コメントメール通知がyuzさんに届いたハズなのに中身が無いって<笑

ーーーーーーーーーーーーーー

昨日はどうもお疲れさまでした。
膝は大丈夫ですか?
大きな家具を移動すると私もあちこち身体が。
あまり無理されない様に!

しかも昨日私が不在の間に出来てる・・・<笑
いやースゴイです、これです、これ!!私の望んでいた事は。
なんでこんな事出来るのか不思議だ〜

私も昨日、用事が終わってから少しJQueryの勉強をしていました。
思った事ができた時の満足感ってやっぱりいいですね!
私も昨日身にしみました。

追記しますーーーーーーーーーーーーーーーーーーー

今ソースを拝見しようと思ったら
ス!スゴイ!
yuzさん、ソース見れなくなってる!!
マジックみたいです、素晴らしい。
  • まこ |
  •  2015/12/23 () 08:03 | 
  • 編集 |
  • 返信
yuz の返信 : おはようございまっ!
>エンターで送信しちゃったみたいで誤送信です
大丈夫ですよ、安心してください、メール吐いていませんから。
ーーーーーーーーーー

今日はヒザがどうかと思いましたが、両腕に筋肉痛があります。
これから、大掃除の真似事を少しずつ始めようと考えていますよ。

ポップアップですかぁ、難しくはなかったですけど。
液晶画面のポチっと黒く光らない事を除いては、特に問題はなかったような?
ほんと、昨日は朝から散々な一日で大損した気分です。
ーーーーーーーーーー

>私も昨日、用事が終わってから少しJQueryの勉強をしていました。
僕は積極的に使った事がないので分かりませんが、難しくないですか。
$記号がいっぱいあって、何ですかあれは???

>yuzさん、ソース見れなくなってる!!
えっ、そんな事はないでしょうよ。
ーーーーーーーーーー

ところで、このポップアップまだ少し改良の余地が残っていて。
閉じるボタンをクリックすると、ブラウザによってはクリック時に枠線が出ます。
まぁ、一瞬の事なのですが、どうやって解消しようか考えています。
というか、その原因が分からないので・・・

追記:::
この返信を書いてすぐに、あたり前の方法を試したら枠線が消えました。
本文記事にも書きましたが・・・
  • 2015/12/23 () 10:27 
コメント : えーなに?
あれソースが見られる・・・。
ほんとにマジックですか?<笑
さっきは本当に見られなかったんですよ。
どうやったのか教えてほしかったぐらいでしたのに・・・。

ーーーーーーーーーーーーーーーー

あー、枠線それはひょっとしてFirefoxとIEによく見られますね。
私もいつもoutline:none;を入れます。
Firefoxなのでめちゃくちゃ気になるんですよ。
クリック後にその画面に戻ると点線が・・・。
リンク後にも残るので気持ち悪いです。
とりあえず原因がわかって良かったですね!

JqueryはCSSと似ていて結構わかりやすいです。
JavaScriptより簡単かも?!です<笑
$(function(){これがないと始まりませんし<笑

あるサイトでわかりやすく教えてくれていたので
なるほど、、、と思いながら書いてみて実装してみたり遊びながら学んでいます。
結構夢中になっちゃった♪
  • まこ |
  •  2015/12/23 () 11:04 | 
  • 編集 |
  • 返信
yuz の返信 : なんでしょうねぇ???
たまたま、何かの不具合で読み込めなかったのでしょうか?
プログラムをCGIにしなければ、どうやってもソースは見る事が出来ますよ。
ただし、実行中の状態のソースはF12で起動するデバッガのようなエディタでないとみられませんけど。
例えば、この動画を貼り付けた部分のソースは、ただの普通の埋め込みコードしか見えませんよね。
でも、F12のデバッガで見ると見えますね。
ーーーーーーーーーー

>私もいつもoutline:none;を入れます。
この閉じるボタンは、ただの画像でなくてフォームのパーツにしたので枠線とか気にしていませんでした。
クリックすると同時にボタンが消える一瞬なので、気付きにくかった事もあります。
ブラウザによっても少し挙動が違うようですし・・・

>JqueryはCSSと似ていて結構わかりやすいです。
>JavaScriptより簡単かも?!
どうなんでしょうか、覚える事が多いかと想像します。
と、書いている途中で適当なサイトを眺めています・・・
ああ、やはりこれ僕には難しそうですよ。
今度なにか、まこさんに作ってもらおうかなぁ。
  • 2015/12/23 () 12:29 
コメント投稿フォーム
名前
タイトル
メール 非公開
URL あなたのHPやBlogなど
携帯絵文字
Vodafone絵文字 i-mode絵文字 Ezweb絵文字
コメント本文
パスワード
秘話コメント
 yuzだけに伝えるコメント
 

yuz_・・・ ブログをご覧の皆さまへ

このブログをご覧になって生じるいかなる問題に対しても、当方は一切の責任を負いません。


PR
忍者ブログ[PR]