jQuery jQuery Won't work in firefox, but will work in other brwosers. Plz help!
Results 1 to 5 of 5

Thread: jQuery Won't work in firefox, but will work in other brwosers. Plz help!

  1. #1
    Senior Member Paul help!'s Avatar
    Join Date
    Aug 2013
    Location
    Manchester, England.
    Posts
    251

    jQuery Won't work in firefox, but will work in other browsers. Plz help!

    Hi Guys.

    I posted a thread on another website and the people on it are not really helping me with my problem.

    I am just being given vague and not very 'to the point' answers.

    Please bear in mind I am a jQuery newbie.

    So if you can just give nice simple answers it would be really helpful.


    Here is a link to my thread.

    http://www.webdeveloper.com/forum/sh...osers-Plz-help!


    ... Could you please have a read of it and let me know how I can fix the problem I am having


    Paul.
    Last edited by Paul help!; 07-20-2017 at 06:02 PM.

  2. #2
    Settled 4 red convertible dalecosp's Avatar
    Join Date
    Jul 2002
    Location
    Accelerating Windows at 9.81 m/s....
    Posts
    8,524
    What's supposed to trigger your opacity transition?
    /!!\ mysql_ is deprecated --- don't use it! Tell your hosting company you will switch if they don't upgrade! /!!!\ ereg() is deprecated --- don't use it!

    dalecosp "God doesn't play dice." --- Einstein "Perl is hardly a paragon of beautiful syntax." --- Weedpacket

    Getting Help at All --- Collected Solutions to Common Problems --- Debugging 101 --- Unanswered Posts --- OMBE: Office Machines, Business Equipment

  3. #3
    Senior Member Paul help!'s Avatar
    Join Date
    Aug 2013
    Location
    Manchester, England.
    Posts
    251
    Its hard to tell you what the exact code is.

    If you go tools -> web developer -> page source

    ...... all the code is there.

    I haven't put any of the JavaScript stuff inside the head element because (for what ever reason) it won't work.

    I had to put it at the bottom of the body element:



    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js" type="text/javascript"></script>
    <script src="js/jquery.waypoints.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.min.js"></script>


    <script type="text/javascript">

    var $dipper = $('.topadvert');
    $dipper.waypoint(function () {
    $dipper.addClass('js-dipper-animate');
    }, { offset: '80%'});


    var $dipper2 = $('.topadvert2');
    $dipper2.waypoint(function () {
    $dipper2.addClass('js-dipper-animate2');
    }, { offset: '80%'});

    </script>

    And these are the HTML elements which are being targeted:


    <div class="col-lg-6 col-lg-offset-3 col-md-6 col-md-offset-3 col-sm-8 col-sm-offset-2 topadvert" style="border: 1px solid black; border-radius: 15px; text-align: center; margin-top: 30px;">

    <div style="padding-top: 30px; padding-bottom: 20px;" id="topadvert">
    <p style="font-size: 20px; font-weight: bold; font-family: century gothic; color: black;">A Leading 'Soda Blasting' Company In Manchester!</p></div>
    </div>
    .................. which doesn't work in firefox


    and:

    <div class="col-lg-5 col-lg-offset-1 col-md-5 col-md-offset-1 col-sm-10 col-sm-offset-1 topadvert2">
    <p style="font-size: 25px; color: #00f; line-height: 150%; font-family: century gothic;" class="sidetext">Soda blasting is the answer to difficult cleaning problems. Delicate fixtures and glass cannot be sandblasted or media blasted because of etching.</p>
    </div>
    .............. which does work in firefox.



    And below is the asscioted css:

    .topadvert {
    display: block;
    opacity: 0;
    transition: all 1000ms ease-in;
    }

    .js-dipper-animate {
    opacity: 1;
    }




    .topadvert2 {
    display: block;
    opacity: 0;
    transition: all 1000ms ease-in;
    }

    .js-dipper-animate2 {
    opacity: 1;
    }



    Its making me pull my hair our!

    Works in every browser apart from firefox

    What am I doing wrong?

  4. #4
    Settled 4 red convertible dalecosp's Avatar
    Join Date
    Jul 2002
    Location
    Accelerating Windows at 9.81 m/s....
    Posts
    8,524
    I see it both in Chrome and in Firefox here. Firefox fades in real quick, some people might not notice the fade.
    /!!\ mysql_ is deprecated --- don't use it! Tell your hosting company you will switch if they don't upgrade! /!!!\ ereg() is deprecated --- don't use it!

    dalecosp "God doesn't play dice." --- Einstein "Perl is hardly a paragon of beautiful syntax." --- Weedpacket

    Getting Help at All --- Collected Solutions to Common Problems --- Debugging 101 --- Unanswered Posts --- OMBE: Office Machines, Business Equipment

  5. #5
    Senior Member Paul help!'s Avatar
    Join Date
    Aug 2013
    Location
    Manchester, England.
    Posts
    251
    Thanks man.

    I checked it on my mum's computer and it worked on hers!

    I even tried uninstalling firefox and re-installing it and it still doesn't work the way it should.

    By the way -- I am viewing it on a pc laptop and I have windows 10.

    It seems to me like a browser issue.

    Do you think I need to change a setting in my browser?

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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