JS Conflict

Hi all,

I’ve run into a conflict with some JS elements. I’m building a page for my site that simply does two things:

  1. Uses Naz Hamid’s Personal Page Template: GitHub - weightshift/The-Personal-Page: This simple one-page website is a way for people to have a very quick and easy personable website that aggregates your activity and positions a simple logo, a portrait and some description text in a nicely-formatted manner. This is licensed under the MIT and GPL licenses.
  2. Floats an Exhibeo Slideshow on the page

The problem I’m having with the slideshow is clearly related to this bit of Javascript from the Personal Page template:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

When this code block is not included, the Exhibeo slideshow works perfectly. When it is included, the slideshow does not work. This is troubling, since I need both JS code blocks to work together for this (really important!) page to work.

I know next to nothing about Javascript. Does anyone have ideas on how these two JS code blocks can work together?

Many thanks for any help!


Exhibeo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Hi Brian,

Try removing the following from the page template to see if thy fixes it:

Joe

On 22 Nov 2012, at 16:52, “Brian McNely” email@hidden wrote:

Hi all,

I’ve run into a conflict with some JS elements. I’m building a page for my site that simply does two things:

  1. Uses Naz Hamid’s Personal Page Template: GitHub - weightshift/The-Personal-Page: This simple one-page website is a way for people to have a very quick and easy personable website that aggregates your activity and positions a simple logo, a portrait and some description text in a nicely-formatted manner. This is licensed under the MIT and GPL licenses.
  2. Floats an Exhibeo Slideshow on the page

The problem I’m having with the slideshow is clearly related to this bit of Javascript from the Personal Page template:

When this code block is not included, the Exhibeo slideshow works perfectly. When it is included, the slideshow does not work. This is troubling, since I need both JS code blocks to work together for this (really important!) page to work.

I know next to nothing about Javascript. Does anyone have ideas on how these two JS code blocks can work together?

Many thanks for any help!


Exhibeo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


Exhibeo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks for the reply, Joe!

That definitely makes the Slideshow playable, but it also renders the dynamic background image static (it’s supposed to scale automatically to any browser size).

Any other suggestions?


Exhibeo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Check the order of library inclusion in your final page. You should include one copy of jQuery very early in the head of the page, and then you can include the Exhibeo and dynamic background scripts after that. If the two included different versions of jQuery, try including only the newest of the two (again, just once).

Walter

On Nov 22, 2012, at 1:35 PM, Brian McNely wrote:

Thanks for the reply, Joe!

That definitely makes the Slideshow playable, but it also renders the dynamic background image static (it’s supposed to scale automatically to any browser size).

Any other suggestions?


Exhibeo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


Exhibeo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks, Walter.

I think I’ll need to find a tutorial on JQuery. I moved the script that Joe suggested to near the top of the head, and indeed the Exhibeo slideshow works. But unfortunately, the dynamic background does not.

I don’t know enough about inclusion order to sort this out…


Exhibeo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Hi Brian,

If you can post a link to the page then we can take a look. Or, if it’s not online, paste the code up on http://pastie.org so we can see where it’s going wrong.

Joe

On 22 Nov 2012, at 20:22, Brian McNely email@hidden wrote:

Thanks, Walter.

I think I’ll need to find a tutorial on JQuery. I moved the script that Joe suggested to near the top of the head, and indeed the Exhibeo slideshow works. But unfortunately, the dynamic background does not.

I don’t know enough about inclusion order to sort this out…


Exhibeo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


Exhibeo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks, Joe.

I pasted everything from the test page on Pastie: http://pastie.org/5419970

If that’s not helpful, I can put all the files on a server instead.

In this version, the backstretch works fine, but the Exhibeo Slideshow does not.

In other words, the page behaves and looks the way I want, but the slideshow doesn’t work.


Exhibeo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks Brian,

Looks like a conflict between the two plugins. The BackStretch one has a public method called resize that’s getting removed by the Exhibeo one. Quick fix for now is to open the image-focus.js file (in the js directory) and either comment out or remove line 663:

$(window).unbind(“resize”);

It shouldn’t cause any problems. If it does, let me know.

Joe

On 22 Nov 2012, at 20:42, Brian McNely email@hidden wrote:

Thanks, Joe.

I pasted everything from the test page on Pastie: http://pastie.org/5419970

If that’s not helpful, I can put all the files on a server instead.

In this version, the backstretch works fine, but the Exhibeo Slideshow does not.

In other words, the page behaves and looks the way I want, but the slideshow doesn’t work.


Exhibeo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


Exhibeo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I forgot to add, you also need to remove the second reference to jQuery (line 129 in your Pastie code).

Joe


Exhibeo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks, Joe!

That worked!


Exhibeo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options