Discussions » Creation Requests

Is it possible to add falling petals as a global style?

§
Posted: 2015-08-22

Is it possible to add falling petals as a global style?

Hi I was redirected to here from userstyles.org, and I have a question?
There's a falling sakura petal code on my tumblr blog, and I was wondering if it's possible to make that into a global style?
I used custom images, so if those could be kept it'd be great ^-^
Thank you so much!!

THE CODE:

if(typeof jQuery=='undefined'){document.write('<'+'script');document.write(' language="javascript"');document.write(' type="text/javascript"');document.write(' src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">');document.write('

')}if(!image_urls){var image_urls=Array()}if(!flash_urls){var flash_urls=Array()}image_urls['rain1']="http://www.blog-switch.com/images/168101.gif";image_urls['rain2']="http://www.blog-switch.com/images/168096.gif";image_urls['rain3']="http://www.blog-switch.com/images/168100.gif";image_urls['rain4']="http://www.blog-switch.com/images/168097.gif";$(document).ready(function(){var c=$(window).width();var d=$(window).height();var e=function(a,b){return Math.round(a+(Math.random()*(b-a)))};var f=function(a){setTimeout(function(){a.css({left:e(0,c)+'px',top:'-30px',display:'block',opacity:'0.'+e(10,100)}).animate({top:(d-10)+'px'},e(7500,8000),function(){$(this).fadeOut('slow',function(){f(a)})})},e(1,8000))};$('
').attr('id','rainDiv')
.css({position:'fixed',width:(c-20)+'px',height:'1px',left:'0px',top:'-5px',display:'block'}).appendTo('body');for(var i=1;i<=20;i++){var g=$('').attr('src',image_urls['rain'+e(1,4)])
.css({position:'absolute',left:e(0,c)+'px',top:'-30px',display:'block',opacity:'0.'+e(10,100),'margin-left':0}).addClass('rainDrop').appendTo('#rainDiv');f(g);g=null};var h=0;var j=0;$(window).resize(function(){c=$(window).width();d=$(window).height()})});
if(typeof jQuery=='undefined'){document.write('<'+'script');document.write(' language="javascript"');document.write(' type="text/javascript"');document.write(' src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">');document.write('

')}



Thank you!

§
Posted: 2015-08-22

This should work:

// ==UserScript==
// @name        Petals
// @namespace   vzjrz1@gmail.com
// @include     *
// @version     1
// @grant       none
// @require     https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js
// ==/UserScript==


if (!image_urls) {
    var image_urls = Array()
}

// image_urls['rain1'] = "http://www.blog-switch.com/images/168101.gif";
// image_urls['rain2'] = "http://www.blog-switch.com/images/168096.gif";
// image_urls['rain3'] = "http://www.blog-switch.com/images/168100.gif";
// image_urls['rain4'] = "http://www.blog-switch.com/images/168097.gif";
image_urls['rain1'] = "data:image/gif;base64,R0lGODlhFAAZAOYAAP33+/7m9P76/P6n3P6z4f604f614v7A5v7d8f7P7P7r9/7s9/7Q7P7z+v70+v7n9P79/f73+//////M6//h8/+h2/+x4f/N7P/4/P+s3/+p3v/2+//d8v+e2v/j9P/P7P+v4P/q9/+o3v/H6f/7/f+65P/A5/++5v+45P+y4f/p9v+95v/F6f/K6v/E6P/5/P/Z8P/X7//b8f/c8f/W7//I6v/y+v/V7//Y8P/l9f/m9f/a8f/v+f/S7v/n9v/s9//0+v/3/P/w+f/8/v/v+P/u+P/z+v/r9//+/v/q9v/s+P/6/P/U7gAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEAABIALAAAAAAUABkAAAfKgBKCg4SFhoeIiYqLjI2OEgETj4IUFRaEF4sYGQMagxwdHoofIAQFHxIhICIjigYlJgcHCCcoBCmKKywTHx8XLS4rBi+IMCwfMTIzMjQJNSc2iDcTOBQ5OjkUOwksPIg0PQg+CjwLKhQxLcSHMTEePzZANgs6OwyJCDA6PA1BDkIBZMhIpEOGDiEO/AkpmCMREYM8gDgAUiTHDkUkZORQYMOIkCMeHizy4EGFgiI/dCRhZAOBBx3YijiiIAMBAiWPXsRg8mOSz5+BAAA7";
image_urls['rain2'] = "data:image/gif;base64,R0lGODlhGAATANUAAAAAAAAAAAICAgMDAwQEBP/I///E///U///K///M///R///W///d///Q///V///a///f///l///e///i///j///h///m///p///r///s///Z///v///x///y///0///1///z///n///S///c///3///X///L///Y///o///w///b///J///F///k///C///T///N///P///D//+1/wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEAAAAALAAAAAAYABMAAAafQIBwSCwaj8hksmA4KJ+IhGLBeCIbjgcDAolYiw/JJBKhVCTfYcVywWQuEYkmTYlgNhzO5kJ5OK1rGR0eHyAbIRIiEFYjFIIfJB8dGBMlJlYnECgpHiQkIBkUGgkUTyMaFBiDHhwYFCcJIlYKKhEZGxsZFhIHKyxfIo0hIREbLSIuv1YvIhoSEipEC2kmMCIiMWlGCQYsLtpHMjPg5EJBADs=";
image_urls['rain3'] = "data:image/gif;base64,R0lGODlhFgASAOYAAP3Y/f7m/v70/v60/v7d/v7Q/v78/v76/v7r/v7A/v7P/v7z/v7e/v77/v/////3///v///J//+4//+u//+t//+v//+8///U///x//+7//+5//+2//+y///K///8///o//+////F///I///E///A///M///9///W///Y///X///S///O///h///j///g///b///N///a///k///p///r///m///y///0///Z///H///w///z///c///d///T///2///i///s///l///n///7/wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEAAA4ALAAAAAAWABIAAAemgA6Cg4SFhoeIiYqLjI2CERITFBUWF44PAwMSGRkaGxwdjR8gIREdIiMkFiWNBAUnKCkqKxEhAK0sLS0uLycFMDGLMi0zCAg0NSwvKRc1hwkhKgQBEDY3NhAzLQQ4LocKORcuMzoLDwI72S083ocRFwwfEDsCAjcYNDI9wYg+L8TVbGDTxuOEIgYvgNSgESQIMhc4VDASwoKFDCFCWgyB4KijR0KBAAA7";
image_urls['rain4'] = "data:image/gif;base64,R0lGODlhIAAeANUAAAAAAAEBAQICAgMDAwQEBBYVFiUlJTQ0NEdGR1JLUt603v7Q/v7e/v7d/v7t/v7P/v7r/v7s/v7D/v/j///r///Z///T///N///M///P///S///Y///U///X///b///c///g///d///a///k///i///o///V///q///W///v///h///m///O///l///n///I///u///w///L///y///F///K///p///H//+8//++//+4///G/wAAAAAAAAAAAAAAACH5BAEAAAAALAAAAAAgAB4AAAb/QIBwSCwaj8ikcslsOocTCqCieDItF8ACI7UmM5rNhjPxJhcdz2cDMiM9lU9I9HEfRxWRaEMSljgZFxZ2HRsdJicADBwoHSgpTRccGxUVKgArHBoLACMmG2oNTgwVIQ1zIp0sFQAWKCIhIR4ookwiDQwNHmlDKwuvHx8VGi1XKB6nHhshQw4cHXQiHS5NLw/AH5dGEBGQTx6f2i4bog0gK3ZDMAxzdYUeIW1uJ/EMwgAdFfBzMWYoH+ykATDxSU8HDl5ELNggogKKDQA8ZFjAgcMCGV5eyFhgQcMFUTNovKhhwYYZCfpe3HgxBASOHDXSAcCBo8iJFzpk7pDJs6fPB59Agwo9EgQAOw==";

$(document).ready(function () {
    var c = $(window).width();
    var d = $(window).height();
    var e = function (a, b) {
        return Math.round(a + (Math.random() * (b - a)))
    };
    var f = function (a) {
        setTimeout(function () {
            a.css({
                left : e(0, c) + 'px',
                top : '-30px',
                display : 'block',
                opacity : '0.' + e(10, 100)
            }).animate({
                top : (d - 10) + 'px'
            }, e(7500, 8000), function () {
                $(this).fadeOut('slow', function () {
                    f(a)
                })
            })
        }, e(1, 8000))
    };
    $('<div></div>').attr('id', 'rainDiv').css({
        position : 'fixed',
        width : (c - 20) + 'px',
        height : '1px',
        left : '0px',
        top : '-5px',
        display : 'block'
    }).appendTo('body');
    for (var i = 1; i <= 20; i++) {
        var g = $('<img/>').attr('src', image_urls['rain' + e(1, 4)]).css({
                position : 'absolute',
                left : e(0, c) + 'px',
                top : '-30px',
                display : 'block',
                opacity : '0.' + e(10, 100),
                'margin-left' : 0
            }).addClass('rainDrop').appendTo('#rainDiv');
        f(g);
        g = null
    };
    var h = 0;
    var j = 0;
    $(window).resize(function () {
        c = $(window).width();
        d = $(window).height()
    })
});

§
Posted: 2015-08-22

Oh! Thank you!! What browser is that for?

§
Posted: 2015-08-31
Edited: 2015-08-31

I recommend to add 2 lines to this script

(function(){
... the above code ... })();
-- to avoid name conflicts with page's scripts.
Or, change // @grant none to // @grant something

§
Posted: 2015-09-10

I lost my laptop and just found this again,
Thank you tressersw, but I have noooo idea on anything about coding so I don't understand the part on adding the 2 lines, but I did change grant none to grant something. It's still not working?
I'm guessing its a lost cause (u_u)
and I still am unclear on what browser this is written for... I'm using chrome?
Thanks for all your help♥

§
Posted: 2015-09-12

What browser is that for?

§
Posted: 2015-09-18
Edited: 2015-09-18

Oh, sorry! I'll try it in firefox now.

Edit: Nah, still not working. Oh well, thank you so soso much for helping me c:

wOxxOmMod
§
Posted: 2015-09-19

Post reply

Sign in to post a reply.