Our recent realization that โhashtag sharingโ could be the alternative to our โPHP mailโ exploits of the past meant that โฆ
- that โproof of conceptโ idea we had of involving the HTML canvas sharing conduit we wanted to tell about, as yet, has not happened because our CSS filters did not flow through via the [canvasContext].drawImage functionality โฆ was not the end of our sharing endeavours because โฆ
- hashtag sharing of the image outerHTML alternative approach โฆ
โฆ comes into play, today. Weโll see what can be done at the canvas element end regarding more โfilter CSS flow throughโ research into the future. Meanwhile, also below see a mechanism by which users can tweak dropdown CSS styling options โฆ
function doemail() {
var emailee=prompt('Please enter email address to share with.', '');
if (emailee == null) { emailee=''; }
if (emailee.indexOf('@') != -1) {
document.getElementById('aemail').href='mailto:' + emailee + '?subject=Image%20Filters&body=' + encodeURIComponent(document.URL.split('?')[0].split('#')[0] + '#image=' + encodeURIComponent(document.getElementById('animg').outerHTML));
document.getElementById('aemail').click();
}
}
function dosms() {
var emailee=prompt('Please enter SMS number to share with.', '');
if (emailee == null) { emailee=''; }
if (emailee != '' && emailee.trim().replace(/0/g,'').replace(/1/g,'').replace(/2/g,'').replace(/3/g,'').replace(/4/g,'').replace(/5/g,'').replace(/6/g,'').replace(/7/g,'').replace(/8/g,'').replace(/9/g,'') == '') {
document.getElementById('asms').href='sms:' + emailee + '&body=' + encodeURIComponent(document.URL.split('?')[0].split('#')[0] + '#image=' + encodeURIComponent(document.getElementById('animg').outerHTML));
document.getElementById('asms').click();
}
}
function embellish() {
var newstyling=prompt('Optionally change styling.', document.getElementById('selopt').innerText);
if (newstyling == null) { newstyling=''; }
if (newstyling != document.getElementById('selopt').innerText && newstyling.indexOf(':') != -1) {
document.getElementById('selopt').innerText=newstyling;
ais=document.getElementById('animg').src;
document.getElementById('danimg').innerHTML="<img style=\"" + newstyling + "\" id=animg src=\"" + ais + "\"></img>";
}
}
And so, onto yesterdayโs Image Element Dynamic CSS Primer Tutorial we have achanged seconddraft Image Element Dynamic CSS web application you can also try below.
Previous relevant Image Element Dynamic CSS Primer Tutorial is shown below.
Weโre curious about something and need to start a new โproof of conceptโ (first draft) phase involving, at this early stage โฆ
- HTML img elements โฆ
- applied dynamic user selected CSS (with an emphasis on dropdown suggested filter property usage) โฆ powered by โฆ
- browsed for or image URL defined content logic
Luckily we have precedents for all this, and this can be a good start! So please try our firstdraft Image Element Dynamic CSS web application you can also try below.
Tomorrowโs work will see whether our theory comes to fruition!
If this was interesting you may be interested in this too.
If this was interesting you may be interested in this too.