link to HTML document not

Page: 1

Author Post
Member
Registered: Apr 2009
Posts: 81
Near the bottom of this page, under Our Story, left-hand column, is a link to an HTML document that contains a video:

http://saxwa.bbdesign.com/

Here is the HTML:

<a class="floatbox naked" data-fb-options="colorTheme:black boxRoundCorners:none boxCornerRadius:0 contentRoundCorners:none contentCornerRadius:0 shadowType:none shadowSize:0 shadowOpacity:0 outerBorder:0 innerBorder:0 padding:0 panelPadding:0 showOuterClose:true width:560 height:315 doAnimations:false showClose:false caption:null" href="https://videos.dimensional.com/video?v=1_qwlsuv79&amp;p=b10a130d-eaed-4b90-a69a-882bf2c3cf15&amp;f=false&amp;d=false"><img class="hljpg alignnone size-full wp-image-247" src="http://saxwa.bbdesign.test/wp-content/uploads/gr_home-video-1.jpg" alt="gr_homevideo1" /></a>

The link basically works in Safari, but not Firefox or Chrome. Is there something wrong with my code? I'm at a loss.

If I remove the data-fb-options tag, that doesn't seem to help, either.

Thank you.
Administrator
Registered: Aug 2008
Posts: 3350
Have you successfully used that wordpress theme with floatbox before? I suspect not.

Floatbox puts a mousedown and touchstart handler on the document and relies on this to know what's going on with user input. Something in that page's theme is blocking all mousedown events from reaching the document, but is letting touchstart events through. Hence that floatboxed link can start by touch, but not by click.

I suspect some script in the page's scroller is capturing mousedown on one or more containing elements in the document and then rudely cancelling the event so that no other handlers see it. I'm still investigating to determine where that is occurring.

In the meantime, a workaround that should let you get on with your real job is to change the 'floatbox' class on the link to 'nofloatbox' and add
onclick="fb.start(this);return false;"
to the link's attributes.
Member
Registered: Apr 2009
Posts: 81
Yes, its iScroll that probably causing that. I'll try your workaround.
Member
Registered: Apr 2009
Posts: 81
That workaround fixed it, thank you. I can live with that for now, I don't have any option as far as the theme as the moment.
Administrator
Registered: Aug 2008
Posts: 3350
I dug into the details a little. The interference is coming from an event handler defined in /js/main-min.js and assigned to mousedown on div#scrollwrapper.

Prettifying that js file, we can see the handler defined in the i.prototype object as _start.

The _start function checks a preventDefault option that is set to !0 (equivalent to true) a little higher up in the code.

The least obtrusive way to hack that code is to alter the _start function very slightly. Where it says "!this.options.preventDefault", we can drop the ! (not) and make it say "this.options.preventDefault". Doing so allows the mousedown event to be seen by the document and Floatbox to proceed without interference.

I'm not suggesting this is the official way to fix the theme, but the information may be useful somewhere in the theme's configuration. If you do find a clean way to resolve the conflict, it would be great if you could post details here for other pilgrims that might be following in your footsteps.

Page: 1