SitePoint Sponsor

User Tag List

Results 1 to 13 of 13
  1. #1
    SitePoint Enthusiast
    Join Date
    Jan 2010
    Posts
    91
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    javascript not applying to my page

    I installed a jquery plugin but it does not seem to show up on my page, anyone know why?
    my page:Imagery Gallery
    the plugin:
    Catch My Fame jQuery Before/After Plugin

  2. #2
    Under Construction silver trophybronze trophy AussieJohn's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    776
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    You'll need to rearrange the order of your scripts. Currently you're including the plugins before you include jQuery itself.

    I see you're also including both the regular and minified version of the plugin script, you should only use the uncompressed version for development as you can often save quite a bit in filesize with the minified version.

    Change the code in your header:
    Code HTML4Strict:
    <script type="text/javascript" src="/jquery.beforeafter-1.3.js"></script> 
    <script type="text/javascript" src="/jquery.beforeafter-1.3.min.js"></script> 
    <script type="text/javascript" src="/jquery-1.6.1.min.js"></script> 
    <script type="text/javascript" src="/jquery-ui-1.8.13.custom.min.js"></script>

    To this:
    Code HTML4Strict:
    <script type="text/javascript" src="/jquery-1.6.1.min.js"></script> 
    <script type="text/javascript" src="/jquery-ui-1.8.13.custom.min.js"></script> 
    <script type="text/javascript" src="/jquery.beforeafter-1.3.min.js"></script>
    var details = {
    . . web: "afterlight.com.au",
    . . photos: "jvdl.id.au",
    . . psa: "usethelatestversion.com"
    }

  3. #3
    SitePoint Enthusiast
    Join Date
    Jan 2010
    Posts
    91
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Its still not recognizing the JavaScript! ? ? ?

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,217
    Mentioned
    457 Post(s)
    Tagged
    8 Thread(s)
    Maybe there's a conflict with Mootools? It might be worth trying jQuery NoConflict.

  5. #5
    SitePoint Enthusiast
    Join Date
    Jan 2010
    Posts
    91
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I will give that a try

  6. #6
    SitePoint Enthusiast
    Join Date
    Jan 2010
    Posts
    91
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I tried adding the no conflict, not sure if I did it correctly:
    Imagery Gallery

  7. #7
    SitePoint Enthusiast
    Join Date
    Jan 2010
    Posts
    91
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm beginning to think that because the page already has so much other js that it's messing with the plugin ? ? ?

  8. #8
    SitePoint Enthusiast
    Join Date
    Jan 2010
    Posts
    91
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    just tried it on a completely blank html document and it worked perfectly.

  9. #9
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,217
    Mentioned
    457 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by nonemauro View Post
    I tried adding the no conflict, not sure if I did it correctly:
    Imagery Gallery
    I'm not sure, I can't see it in there. BUT: I've just noticed that the link to this file:

    Code:
    <script type="text/javascript" src="/js/jquery.beforeafter-1.3.min.js"></script>
    leads not to the jQuery file, but to an html page, so you need to fix that first of all.

  10. #10
    SitePoint Enthusiast
    Join Date
    Jan 2010
    Posts
    91
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    oh im just cleaning up the code a bit and trying a few different things. I will post my results soon.

  11. #11
    SitePoint Wizard bronze trophy Immerse's Avatar
    Join Date
    Mar 2006
    Location
    Netherlands
    Posts
    1,661
    Mentioned
    7 Post(s)
    Tagged
    1 Thread(s)
    And they cause 404 errors.

    Best make sure the files are in the correct location.

    Quote Originally Posted by ralph.m View Post
    I'm not sure, I can't see it in there. BUT: I've just noticed that the link to this file:

    Code:
    <script type="text/javascript" src="/js/jquery.beforeafter-1.3.min.js"></script>
    leads not to the jQuery file, but to an html page, so you need to fix that first of all.

  12. #12
    SitePoint Enthusiast
    Join Date
    Jan 2010
    Posts
    91
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I got it to work!! however I still have a small problem. It disables the lightbox function on my website.
    Imagery Gallery
    Page with Lightbox:SAR 101

  13. #13
    Under Construction silver trophybronze trophy AussieJohn's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    776
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    At the moment you have your Lytebox.js script commented out which is why the lightbox isn't working.

    I would suggest uncommenting the lines in the header line by line until you get an error (which will likely be around the mootools)

    If it is indeed the mootools library causing the error, it will be worth trying the jQuery.noConflict method again.

    To make sure the jQuery.noConflict will work you'd need to modify the 3 lines near the top to say:

    Code HTML4Strict:
    <script type="text/javascript" src="/jquery-1.6.1.min.js"></script> 
    <script type="text/javascript" src="/jquery-ui-1.8.13.custom.min.js"></script> 
    <script type="text/javascript" src="/jquery.beforeafter-1.3.min.js"></script>
    <script type="text/javascript"> 
    	jQuery.noConflict();
    	jQuery(function(){
    		jQuery('#bf_container').beforeAfter();
    	});
    </script>
    var details = {
    . . web: "afterlight.com.au",
    . . photos: "jvdl.id.au",
    . . psa: "usethelatestversion.com"
    }


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •