Grow your CSS skills. Land your dream job.

Making it ALL work together on the same page

  • # February 28, 2013 at 12:55 pm

    Hi! I am new to web design. I finished classes at the end of 2012.

    I am in the process of putting a site together and I am finding that my javascripts will not play nice with one another. I want to add too many jquery scripts and they conflict.

    Here is what I am using:
    ParallaxContentSlider (http://tympanus.net/Development/ParallaxContentSlider/)
    The Facebook Wall (http://tutorialzine.com/2011/03/custom-facebook-wall-jquery-graph/)
    And the Sticky Bar Footer (http://www.dynamicdrive.com/dynamicindex17/stickybar.htm) — AND the person who I am working with would like me to add another slideshow!!

    Now, I have the parallax slider in place and working. When I add the footer, it just does not work. When I add the facebook wall, the information in the parallax slider disappears.

    What do I do??? Any help you can offer would be a BIG HELP! Thanks.

    # February 28, 2013 at 1:09 pm

    Would it be possible to have a link to a demo so that we can **see** the issue?

    # February 28, 2013 at 4:07 pm

    Well, I have been fighting the issue and in a “little fit”, I deleted all the codes — except for the slider.
    Here is the link:
    http://crossfitchoice.com/choicewireframe.html

    It just has the slider on it. The Footer would obviously go at the bottom… and I plan on putting the facebook wall after the testimonials.
    Let me know if I should try to add all the code again…. (I just got frustrated.)

    # February 28, 2013 at 5:32 pm

    If you don’t, we can’t really help you troubleshoot it.

    # February 28, 2013 at 9:03 pm

    Okay…. I will work on it – and post tomorrow. THANKS for your help!

    # March 1, 2013 at 1:29 pm

    It is posted at http://crossfitchoice.com/choicewireframe.html

    You will see the content of the slider has disappeared. The content of the footer is floating to the left in the section above. And the facebook wall is not appearing.

    I have not really styled all these features… I just wanted to get them to work first!

    Any Help that you can offer would be WONDERFUL!

    # March 1, 2013 at 2:19 pm

    Okay, wow. At first glance, you got problems.

    You’re calling jQuery three different times, in three different places, all different versions (1.4.2, 1.5.1, and 1.7.1. One of these is stickyajax.js). Call it once (the latest version if possible), at the bottom of your page, before any plugins.

    Move all of your scripts to the bottom of the page, with all jQuery plugins called AFTER jQuery.

    Let us know when you’ve done this and we can troubleshoot further.

    # March 7, 2013 at 1:35 pm

    Sorry, I got a VERY bad earache and was not able to work on anything…. but as you can see I need help. I will work on the structure and get back with you all. Thank you so much for your patience.

    # March 14, 2013 at 12:07 pm

    So, I made the attempt to move all scripts to the bottom. And I took out the extra calls for jquery.
    (In my jQuery class they had us add the script up top- but we never added more than one effect… so this is all new to me.)

    It seems more messed up than ever.

    Can you help or is is beyond help?

    # March 14, 2013 at 12:08 pm

    Here is the link: http://crossfitchoice.com/choicewireframe.html

Viewing 10 posts - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".