1

My website has been using the following external files successfully:

http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css
http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js
http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js

Now I would like to implement a jQuery popup window that requires the following additional files to work:

http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css
http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js

But now the text on the page is distorted. It seems to be stretched vertically.

Does anyone have a suggestion? Is there possibly a conflict between these two jQuery files and the Bootstrap file?

Thank you.

CurtisD
  • 163
  • 1
  • 9

1 Answers1

2

A specific jQuery function called jQuery.noConflict() can be used to remove conflicts with any other libraries.

you can find more about it here on this Link

A small snippet on how to use it - 

<script src="other_lib.js"></script>
<script src="jquery.js"></script>
<script>
$.noConflict();
jQuery( document ).ready(function( $ ) {
  // Code that uses jQuery's $ can follow here.
});
// Code that uses other library's $ can follow here.
</script>
Manoj Salvi
  • 2,639
  • 1
  • 17
  • 21
  • This seems like a good idea and I will try it. I might also replace the jQuery.mobile library with another such as jQuery.ui. – CurtisD Nov 28 '15 at 07:54
  • I'll be in touch as soon as I get a chance to try it. Thanks for offering your help. – CurtisD Nov 29 '15 at 00:59