What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    Where To Insert Jquery Script NoConflict

    Asked by humbuckermusic on July 31, 2013 at 10:23 PM

    Presently, my website uses jQuery for my items' multiple images as well as "tabbed content".

     

    Here is how it is supposed to look:  http://www.humbuckermusic.com/dr-z-antidote-red.html

    I have created an image that pulls up a jotform lightbox form and it works well, however, when it's enabled, the tabs and images no longer work properly:  http://www.humbuckermusic.com/dr-z-antidote-black.html

     

    I understand the fix is using : $.noConflict();   --- Problem is, I just don't know where to place it.

    My form script is:

    <script src="//www.jotform.com/min/g=feedback" type="text/javascript"> new JotformFeedback({ formId:'32088022600846', base:'http://jotform.co/', iframeParameters: { 'referrer': document.title}, windowTitle:'Stock Notify Request', background:'#8ec69f', fontColor:'#112244', type:false, height:550, width:420 }); </script> <a class="lightbox-32088022600846" style="cursor: pointer; color: blue; text-decoration: underline;"><img src="//lib.store.yahoo.net/lib/humbucker/notify-stock.jpg" border="0"></a>

     

    Any ideas?  Thanks!

     

     

    Page URL:
    http://www.humbuckermusic.com/dr-z-antidote-black.html

    lightbox form JotForm New JotForm form script problem style
  • Profile Image
    JotForm Support

    Answered by EltonCris on August 01, 2013 at 02:37 AM

    Hi,

    Here's how to fix it.

    Find this codes in your page.

     

    <script type="text/javascript">$(document).ready(function(){var obj = $(".tabinfomain").tabbedInfo({firetab:0});});</script>

    <link rel="stylesheet" type="text/css" target="_blank" href="http://lib.store.yahoo.net/lib/humbucker/sc-cte4-styles.css" rel="nofollow" rel="nofollow"></link><script type="text/javascript" src="//lib.store.yahoo.net/lib/humbucker/scprettyphoto.js"></script>

    <script type="text/javascript">$(document).ready(function(){$("a[rel^='prettyPhoto']").prettyPhoto({animationSpeed: 'normal', /* fast/slow/normal */padding: 40, /* padding for each side of the picture */opacity: 0.7, /* Value betwee 0 and 1 */showTitle: false,allowresize: true, /* true/false */theme: 'light_rounded', position: 'left', insetsize: 35, callback: function(){}});});</script>

     

    Replace every $ with jQuery, that should fixed it. For your reference: http://learn.jquery.com/using-jquery-core/avoid-conflicts-other-libraries/

    Here's a working demo: https://shots.jotform.com/elton/251136_working_demo.html

    No need for the noConflict code FYI. :)

    Thanks!

  • Profile Image

    Answered by humbuckermusic on August 01, 2013 at 09:09 AM

    Amazing!  This is some of the best support I've ever seen.  Thank you so much!  I have one other separate issue (I'll start another thread), but if that get's resolved, I'll be upgrading my account.

    Thanks again!

  • Profile Image

    Answered by jeanettebmz on August 01, 2013 at 11:28 AM

    We appreciate your words and great feedback towards Elton and the Support Staff

    Cheers!