math - Jquery: how to produce 1 of 3 phrases when event happens -
i have bookmarking feature on site, when person clicks paragraph, box hovering on paragraph reads "bookmark this" inserts "sweet man" in place of "bookmark this". 'bookmark this' disappears , "sweet man" takes place, how make when click on paragraph, places 1 of 3 random phrases in there, lets 3 phrases "success", "sweet man", , "awesome". here's little bit of code show random phrase placed.
$('p').click(function (e) { var offset = $(this).offset(); var top = offset.top if ($('#placebookmark').hasclass('placing')) { $('#placebookmark').trigger('click') $('#bookmark').css({left: offset.left - 30, top: top}).show(); $('#bookmarkthis').html('***sweet man.***').delay(1000).fadeout(400, function(){ $(this).html('bookmark this') }) } });
see in code says "sweet man.", that's 1 of 3 random phrases should placed after user clicks paragraph.
thank-you
$('p').click(function (e) { var offset = $(this).offset(); var top = offset.top // list of phrases var phrases = ["success", "sweet man", "awesome"]; if ($('#placebookmark').hasclass('placing')) { $('#placebookmark').trigger('click') $('#bookmark').css({left: offset.left - 30, top: top}).show(); // selects random phrase list. // note doesn't require length three, // can add , remove phrases above without changing line. var selectedphrase = phrases[math.floor(math.random() * phrases.length)]; $('#bookmarkthis').html(selectedphrase).delay(1000).fadeout(400, function(){ $(this).html('bookmark this') }) } });
edit
as separate function:
var getrandomphrase = function() { var phrases = ["success", "sweet man", "awesome"]; return phrases[math.floor(math.random() * phrases.length)]; };
or phrases arguments:
var getrandomphrase = function(phrases) { return phrases[math.floor(math.random() * phrases.length)]; };
use this:
... $('#bookmarkthis').html(getrandomphrase()).delay(1000).fadeout(400, function(){ ...
or, when phrases used arguments:
... $('#bookmarkthis').html(getrandomphrase(["success", "sweet man", "awesome"])).delay(1000).fadeout(400, function(){ ...
Comments
Post a Comment