Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Audio/Video issue with HTML5 in a Modal #3149

Closed
wants to merge 1 commit into from

Conversation

ivebeenlinuxed
Copy link

Hi,

Apologies if I'm doing this all wrong, but I noticed a bug today which wouldn't allow you to click HTML5 audio/video controls (Chrome tested) when embedding them in a Bootstrap modal window. Fix is included in this small patch.

If I'm doing things wrong let me know! I can only learn what I am taught, and contributing to open source projects is new to me.

diff --git a/js/bootstrap-modal.js b/js/bootstrap-modal.js
index e929706..ef63ed5 100644
--- a/js/bootstrap-modal.js
+++ b/js/bootstrap-modal.js
@@ -201,10 +201,11 @@
       var $this = $(this), href
         , $target = $($this.attr('data-target') || (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '')) //strip for ie7
         , option = $target.data('modal') ? 'toggle' : $.extend({}, $target.data(), $this.data())
-
-      e.preventDefault()
+      if (!$(e.target).is("audio,video")) {
+        e.preventDefault()
+      }
       $target.modal(option)
     })
   })

-}( window.jQuery );
\ No newline at end of file
+}( window.jQuery );

@mfansler
Copy link
Contributor

There is a selector on the click event listener '[data-toggle="modal"]'. The only way that this plugin would be preventing the HTML5 controls from working is if they are getting selected by that, which doesn't make any sense.

Could you share a sample of your html?

@fat
Copy link
Member

fat commented Jul 22, 2012

Hey @ivebeenlinuxed,

Thanks for opening this pull-request! Unfotunately, it looks like it fails to pass the tests neccessary for submitting to bootstrap. The following tests are currently failing:

  • should always be made against -wip branches
  • should always include a unit test if changing js files

For a full list of issue filing guidelines, please refer to the bootstrap issue filing guidelines.

thanks!

@fat fat closed this Jul 22, 2012
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants