Firefly Jquery not working

Question

I put this in my head, there is no other jquery stuff in there.

Can anyone suggest why this is not working. my page is here - www.haelu.co.nf

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript" src="https://raw.github.com/motyar/firefly/master/jquery-firefly-0.2.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $.firefly({
            images : ['http://www.itsfirefly.com/images/fly1by1.png','http://www.itsfirefly.com/images/fly2by2.png'],   //Fly images        
            total : 165, //number of flies
            on: '#header' //id of div
        });
    });
</script>

You're using a fairly old version of jQuery. You're getting an error from the firefly plugin that might be due to that. — Pointy, Nov 03 '13 at 18:27
I am using the exact version that was given on the download page. I'm just following instructions. Originally I was trying with the latest jquery but that didn't seem to work either — Haelu, Nov 03 '13 at 18:30
Ah - well your problem is that there is no "header" `
` element. — Pointy, Nov 03 '13 at 18:32

score 1 · Answer 1 · answered Nov 03 '13 at 18:33

1

You're telling the plugin to put the effect on an element with the id "header", but there is no such element on your page.

answered Nov 03 '13 at 18:33

Pointy

405,095
59
585
614

good point. although even with that part there, it seems to work with the change of firefly script. – Haelu Nov 03 '13 at 19:14
@Haelu yes, because the older version of Firefly pays no attention to that configuration parameter. It does not support that feature - you can only apply the effect to the whole page. – Pointy Nov 03 '13 at 19:23
the new version doesn't seem to work at all for me, even when I remove the element indicator. I'll just stick with the old one that works – Haelu Nov 05 '13 at 05:25

score 0 · Answer 2 · edited May 23 '17 at 12:21

0

Opening this in chrome it won't execute the firefly script.

This is the error I see in the console.

Refused to execute script from 'https://raw.github.com/motyar/firefly/master/jquery-firefly-0.2.js' because its MIME type ('text/plain') is not executable, and strict MIME type checking is enabled.

I think this should solve your problem.

Link and execute external JavaScript file hosted on GitHub

http://rawgithub.com/

edited May 23 '17 at 12:21

Community

1
1

answered Nov 03 '13 at 18:27

Jazzepi

5,259
11
55
81

It doesn't work in Firefox either, and Firefox doesn't refuse to run the plugin. – Pointy Nov 03 '13 at 18:29

score 0 · Answer 3 · answered Nov 03 '13 at 18:27

You have an error:

Resource interpreted as Script but transferred with MIME type text/plain: "https://raw.github.com/motyar/firefly/master/jquery-firefly-0.2.js". www.haelu.co.nf/:9
Refused to execute script from 'https://raw.github.com/motyar/firefly/master/jquery-firefly-0.2.js' because its MIME type ('text/plain') is not executable, and strict MIME type checking is enabled. www.haelu.co.nf/:1

score 0 · Accepted Answer · answered Nov 03 '13 at 18:30

Working Solution

Since there are issues with accessing the file from GitHub, alternatively you can get the script from the developer's demo page, which is not advisable.

Errors

Resource interpreted as Script but transferred with MIME type text/plain: "https://raw.github.com/motyar/firefly/master/jquery-firefly-0.2.js". www.haelu.co.nf/:9
Refused to execute script from 'https://raw.github.com/motyar/firefly/master/jquery-firefly-0.2.js' because its MIME type ('text/plain') is not executable, and strict MIME type checking is enabled. www.haelu.co.nf/:1

Solution

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript" src="http://www.jongaulin.com/articles/firefly/jquery.firefly.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $.firefly({
            images : ['http://www.itsfirefly.com/images/fly1by1.png','http://www.itsfirefly.com/images/fly2by2.png'],   //Fly images        
            total : 165, //number of flies
            on: '#header' //id of div
        });
    });
</script>

Fiddle: JSBin

That's a different version of the plugin you're using. In particular, that "on" configuration parameter is ignored by that version. — Pointy, Nov 03 '13 at 18:36
ok cool. this firefly script works. The one I downloaded also doesn't work. And this also works with the latest jquery too — Haelu, Nov 03 '13 at 18:47
Can anyone suggest how I can get my logo to come in front of the flies, instead of them flying over everything? I tried checking the source for www.itsfirefly.com but I can't work it out how they did it — Haelu, Nov 03 '13 at 18:59

Firefly Jquery not working

4 Answers4

Working Solution

Errors

Solution

Fiddle: JSBin