Landing Page Byline Emojis Tutorial

Landing Page Byline Emojis Tutorial

Here at RJM Programming we have the byline …

Software Need Not Be Hard!

… appearing on our changed index.php Landing Page. Today, we’ve decided to animate this byline by allowing it to receive varying amounts of emoji input to add some variety.

This was achieved just with additional Javascript (DOM, that is), written into the PHP, as per …

<?php echo ”

var gbyline='', mredon=false, sarttarget='', sarthref='';

function well(evt) {
evt.stopPropagation();
window.open('//www.rjmprogramming.com.au/HTMLCSS/karaoke_youtube_api.htm?youtubeid=hMPbipfgQ2c&youtube_duration=41.808&email=&email=&emoji=on&c0=on&i0=9&j0=11&i1=&j1=&i2=&j2=&i3=&j3=&i4=&j4=&i5=&j5=&i6=&j6=&i7=&j7=&i8=&j8=&i9=&j9=&i10=&j10=&i11=&j11=&i12=&j12=&i13=&j13=&i14=&j14=&i15=&j15=&i16=&j16=&i17=&j17=&i18=&j18=&i19=&j19=&i20=&j20=&i21=&j21=&i22=&j22=&i23=&j23=&i24=&j24=&i25=&j25=&i26=&j26=&i27=&j27=&i28=&j28=&i29=&j29=&rand=','_blank','top=50,left=50,width=800,height=800');
}


function vs(togmode) {
if (togmode != mredon) {
if (togmode) {
document.getElementById('sart').target='_self';
document.getElementById('sart').href='#';
} else {
document.getElementById('sart').target=sarttarget;
document.getElementById('sart').href=sarthref;
}
}
return togmode;
}


function bylineemojis() {
var lastcfrom='ed', lastcto='';
var inideas=['Soft','Hard','Hard','Soft','Not','Be','wa','ware','!','|','Nee','ed','Need','No','So','ar','war','war','war','Ha','Software','Software'];
var ideas=['&#x1F366;','&#x1F4A0;',String.fromCodePoint(0x26CF,0xFE0F),'&#x1FAE0;','&#x1FAA2;','&#x1F41D;','&#x1F62D;','&#x1F3FA;','&#x2757;','&#x1F4E3;','&#x1F9B4;','<a id=amred style=z-index:156; href=# onclick=well(event); title=\"Hello, I' + \"'\" + 'm Mr Ed\"></a>','&#x266D;','&#x26D4;','&#x1FAA1;','&#x1F62E;','&#x1FA96;',String.fromCodePoint(0x2694,0xFE0F),'&#x1FAE1;','&#x1F602;', String.fromCodePoint(0x1F469,0x200D,0x1F4BB), String.fromCodePoint(0x1F468,0x200D,0x1F4BB)];
if (gbyline == '') { gbyline=document.getElementById('byline').innerHTML; sarttarget=document.getElementById('sart').target; sarthref=document.getElementById('sart').href; }
var outideas=gbyline;
var lenideas=eval('' + ideas.length);
var howmany=Math.floor(Math.random() * lenideas), thatone=0;
for (var ii=0; ii<howmany; ii++) {
thatone=Math.floor(Math.random() * howmany);
if (inideas[thatone] == 'ed') {
lastcto=ideas[thatone];
} else {
outideas=outideas.replace(inideas[thatone], ideas[thatone]);
}
}
if (lastcto != '') { if (outideas.indexOf('ed') != -1) { mredon=vs(true); } else { mredon=vs(false); } outideas=outideas.replace(lastcfrom, lastcto); } else { mredon=vs(false); }
document.getElementById('byline').innerHTML=outideas;
}

setInterval(bylineemojis, 5000);

“; ?>

As usual, whenever we deal with emojis we find Emojipedia just great, thanks. Also helpful with today’s work was this link.

If this was interesting you may be interested in this too.