Video in modal


#1

@norm I have a video in a modal that if you close the modal (toggle modal) the sound from the video is still playing.

Is this a bug or is there a way around this? I am using Blocs 3.2.2


#2

Hello @eagle
I don’t know if you bother that question is answered by me.
If not, there is the code:

<script>
$(function(){
  $("body").on('hidden.bs.modal', function (e) {
    var $iframes = $(e.target).find("iframe");
    $iframes.each(function(index, iframe){
      $(iframe).attr("src", $(iframe).attr("src"));
    });
  });
});
</script> 

Just add it in the code of the page preferences on the top of the header.


#3

I looked at the code with interest while trying to figure out how this stops the audio and can’t figure it out.


#4

Hello @KBConcepts, this code is triggered by the “hidden” of the modal. And when the script detects the Hide command, it just reset all iframes inside all modals.

  1. Script detect the hide command :
> $(function(){
>   $("body").on('hidden.bs.modal',
  1. Reset all iframes: (change the movie iframe code “xxx.mp4” to “src” ->nothing)
> var $iframes = $(e.target).find("iframe");
>     $iframes.each(function(index, iframe){
>       $(iframe).attr("src", $(iframe).attr("src"));

#5

Thanks for taking the time to explain this. :grinning:


#6

Whow! I wish I would have your brain. genius.


#7

Thank you soooo much.
I was looking for that a long time.
Works perfect.


#8

By the way the problem that @eagle report only happened because he make the close button, to hide the modal with the atributes data-dismiss, and change the action of the button to “none”, because if you leave the button to “navigate to page” you automatically reload the page and the modal resets to close state.

The data-dismiss atribute only hide the modal, but doesn’t stop anything, if you open the modal again while the audio is playing you will find that the video is playing as well


#9

I agree @Pealco knows the back end codes! His help in Blocs has enhanced so many area in our website designs. I think it’s really cool he is willing, like our friend @Eldar and many others, to share such important knowledge with us. Having gentlemen being taking time out of their busy schedules for us is really great. I’m surprised @Norm has not implemented some of the working Blocs / Brics Pealco has developed in The Blocs Store. I guess we have to be patient. :slight_smile:


#10

Thank you @KBConcepts @Bootsie @StFoldex today I really take all my Time to help here… but when I have the thanks of the users I help and others, that keeps me helping. About @Norm Bloc Store, he could create like a Snipets Lab and I can reply to all of the questions with Snippets and then redirect the replies in the topics to that Snippet Place in the store. I don’t know, just an idea… So it makes easy for others users found the codes when they need them.


#11

Hey @eagle do you have a link that shows the video in a modal? I am curious how you used that feature.

Thanks
Rich


#12

In my case I used a youtube video by adding a video bric in the modal body.


#13

Thanks for the tip!


#14

Thanks for this! Do you maybe know a code snippet that makes a youtube video start by opening the modal?


#15

Hello @wolfganghofer I’m at iPad, so no garanties.
But I have my last snippet hope it works:

<iframe src="//www.youtube.com/embed/{{YOUTUBE-ID}}?autoplay=1&mute=1" name="youtube embed" allow="autoplay; encrypted-media" allowfullscreen></iframe>

Hope it works…


#16

Hi Pealco! Thanks, I tried this already before, but the problem is that I use 3 Youtube videos in modals on one page. With autostart all of the videos start, not just the one whose modal is opened.


#17

Hello @wolfganghofer a little of work, but I think I found a solution:

Is this what you want?

https://blocs.webtekpc.pt/exemples/wolfganghofer/


#19

Hi! I tried to open the link but it does not work…


#20

Hi @wolfganghofer

I think @Pealco is currently redesigning his site…

MDS


#21

Link is not working