cconoly

What version PHP did you go to? Did you try clearing the cache in the WP-Flybox settings?

Sorry, it took me a while to figure out the best solution. The problem is that the theme uses an “unfriendly” way of making it responsive. Basically, in desktop mode it makes all the divs 100% width using jquery after the page is loaded. No matter what I set the WP-Flybox plugin to, it always will get changed by the theme’s javascript.

However, I added a fix, but it will require editing a line in your theme and updating the WP-flybox plugin. I added a class selector for the WP-Flybox tabs, so update the plugin. Then I had to change a line in the theme’s responsive javascript to not include the class selector I set in the WP-Flybox plugin. Here is what you would need to do to fix it:

1) Update WP-Flybox to 6.1 or higher
2) Open the file to edit: wp-content/themes/exclusive/scripts/responsive.js. Unfortunately this has to be done via FTP or another file editor and cannot be done through wordpress admin since it is a js file.
3) Change line 51 from:
jQuery("body > div, body header, body footer, body nav").width("100%");
to:
jQuery("body > div, body header, body footer, body nav").not('.wp-flybox_tab').width("100%");
4) Save the file and upload it over the old version.
5) Clear your cache and reload your page.

Let me know how this works for you. Thanks!

Thanks! Glad it worked! In the next update I may make it automatically stick it to the edge when only one tab is used. Thanks again!

Oooohhhh OK. Open wp-flybox/body_import.php and on line 87 where it says:

//filler
  echo '<div style="height:10px;width:'.$my_tab_max_width.'px;display:inline-block;float:'.$right_or_left.';"></div>';

change the display:inline-block to display:none like:

//filler
  echo '<div style="height:10px;width:'.$my_tab_max_width.'px;display:none;float:'.$right_or_left.';"></div>';

It was designed to not stick to the side because most people have more than one tab and we didnt want the content to slide out over the next tab, but you have one so you probably want it to stay on the side. Let me know if this does not fix it. Thanks!

OK. I’m not sure what you mean. Can you take a screenshot of what it looks like on your end? Here is what it looks like on my end: https://postimg.org/image/wd0lbm4yj/ The CSS for WP-Flybox can be found in each file. So for facebook it would be in wp-flybox/includes/facebook_tab.php.

So there is no difference for you on those two options when you scroll down the page? I simulated the option change on your site and the tabs stayed in place on the browser when I scrolled with one option and it stayed at the top of the page with the other option. I’ll have a look tomorrow and make sure the code is applying the option correctly.

Try this. Go to WP-Flybox settings then Display Options. Then on the third option choose “Attached to Page” and let me know if that does it.

Ha. Ok. Can you post or email me a link to the website that it’s having a problem on? And explain a little more what you want so I can be sure we are on the same page? Thanks!

Hmmm… Did you try the “attach to page” or “float with page” option? I think it’s under general or display options?

No problem! I changed the way that worked back in an earlier version and some instances the options had to be reset. Thanks!

What is your website? Is it currently turned on and on one side or the other? Make sure also that the “Show On” options are all checked. Thanks

I converted the sprite images to individual images. Download the package at: https://cconoly.com/WP-Flybox%20Sprite%20Images.zip.

Upload the image files you want to use to your wordpress media. Then go to each image and copy the URL of the image under Attachment Details. Then paste that URL into the “Custom Tab URL” for each tab under the WP-Flybox Settings. Also change the height and width setting for each tab right under the “Custom Tab URL” setting to whatever size you want.

Let me know if you have any problems!

OK right now it uses the jquery ready function which starts once the DOM is loaded, or the web page script. Once the DOM is loaded, then it renders the tabs. I will add another function that renders it after all the external content has been loaded such as pictures and scripts by jquery load function. This should render it quickly once the page starts appearing, and then make sure it is aligned once finished loading. I will add this sometime in the next couple days and release it with the WordPress 4.0 updates.

Well would it help if I added an option to render once at the page load, and then rerender again after 1 or 2 or 3 seconds after page load?

After testing it on one of my sites I didnt find any problems. I thought it was not showing, but I had the settings to Off instead of choosing a side. Once I chose a side in the wp-flybox settings it worked. Is there a site you can show my where it does not work?