Welcome, Guest: Register On Nairaland / LOGIN! / Trending / Recent / NewStats: 3,195,105 members, 7,957,130 topics. Date: Tuesday, 24 September 2024 at 07:37 AM |
Nairaland Forum / Science/Technology / Programming / Please Help On How To Insert Smiley In An Output Text In Java Script (1798 Views)
How To Insert Data Into An Online Mysql Database In Java / Help (wrap Text In J2ME & Scroll Vertically) / I Use Open App.path & "file.txt" For Output As #1 But Wasnt Working In Vista (2) (3) (4)
Please Help On How To Insert Smiley In An Output Text In Java Script by davroca16(m): 9:25pm On Aug 31, 2014 |
Please everyone, all I need is a tutorial or a push toward the right direction. Am creating a web app using jsf in java. Thanks. |
Re: Please Help On How To Insert Smiley In An Output Text In Java Script by dhtml(m): 9:33pm On Aug 31, 2014 |
Ehen? |
Re: Please Help On How To Insert Smiley In An Output Text In Java Script by Nobody: 1:40am On Sep 01, 2014 |
oga sir, the title of your thread does not flow with the post you have up there. what exactly do you need? a jsf tutorial or how to insert/show smileys in an html document with javascript? |
Re: Please Help On How To Insert Smiley In An Output Text In Java Script by dhtml(m): 8:58am On Sep 01, 2014 |
^^^Na why i talk ehen be that, the post never complete. |
Re: Please Help On How To Insert Smiley In An Output Text In Java Script by davroca16(m): 9:40am On Sep 01, 2014 |
olucurious: oga sir, the title of your thread does not flow with the post you have up there. what exactly do you need? a jsf tutorial or how to insert/show smileys in an html document with javascript? No vex abeg. I need help on how to insert smileys in a html document using javascript. Especially in an outputText element. Like the four smiley's above. |
Re: Please Help On How To Insert Smiley In An Output Text In Java Script by Olyboy16(m): 4:41pm On Sep 01, 2014 |
davroca16: They'r mostly refered to as bbcodes. And using javascript to implement that kind of thing may be expensive unless your webpage is in pure html format. If its a server script, its much convinient to add the bbcode symbol parser in the server side script. Now u may ask why i said using js is only best on pure html pages?? Here- the most convinient way to implement bbcodes is the use of symbols. E.g, if a user wants to insert a smiley in his post, he may type '/(/'. Depending on your symbol of choice for a particular smiley. Now the user submits d post. Now when displayin d post to d user, you tell js to find the symbols for smileys and replace them with their coresponding smiley pic locations. I.e '/(/' = 'http://site.com/smiley_folder/smiley.gif'. And then wrap the img tag markup appropriately around the image address. But the de-merit is that this wil cause sily segregated page requests. Why? U rmmba d browser downloaded the smiley symbols and not the actual pics, so when js refines d symbols to img tags, the browser wil nw hav to make seperate requests for all the smileys on the page after d page has bn downloaded causing the page to display first and smileys causing loading delays. Nw imagine a page wif 200 smileys... |
Re: Please Help On How To Insert Smiley In An Output Text In Java Script by cyrielo(m): 9:59pm On Sep 01, 2014 |
^^^ you can have all smiley in one jpeg file, then use css media query to pick the one you want. this will cause the browser to download only one smileys.jpeg file and use css to manipulate the positions |
Re: Please Help On How To Insert Smiley In An Output Text In Java Script by davroca16(m): 6:53am On Sep 02, 2014 |
olyboy: ^^^ @olyboy specifically dhtml, thanks but can please give me a tutorial or a link to where I can get a tutorials of it. |
Re: Please Help On How To Insert Smiley In An Output Text In Java Script by davroca16(m): 6:54am On Sep 02, 2014 |
cyrielo: ^^^ you can have all smiley in one jpeg file, then use css media query to pick the one you want. this will cause the browser to download only one smileys.jpeg file and use css to manipulate the positions Are you saying css can be used to insert smiley image in an output text? |
Re: Please Help On How To Insert Smiley In An Output Text In Java Script by cyrielo(m): 6:26pm On Sep 02, 2014 |
davroca16:yea |
Re: Please Help On How To Insert Smiley In An Output Text In Java Script by davroca16(m): 7:13pm On Sep 02, 2014 |
cyrielo: yeatutorials pls or kindly share me a link to any tutorial on it. |
Re: Please Help On How To Insert Smiley In An Output Text In Java Script by cyrielo(m): 9:56pm On Sep 03, 2014 |
i don't know of any tutorial out there but here is the logic. when a user submits a post replace the smile code with a div that has an id that describe the smiley code, use css to add a background image that describe the smiley code to the div. You can have loads of images but that would be inefficient. u can merge all smiley images into one JPEG file or any other format. you can achieve that with corel draw or photoshop or any other image Software. then while setting background image also set background-position to pick specific icon from the single image file |
Re: Please Help On How To Insert Smiley In An Output Text In Java Script by Olyboy16(m): 10:09pm On Sep 03, 2014 |
cyrielo: ^^^ you can have all smiley in one jpeg file, then use css media query to pick the one you want. this will cause the browser to download only one smileys.jpeg file and use css to manipulate the positionsdont u think thats a little too advanced for the guy? |
Re: Please Help On How To Insert Smiley In An Output Text In Java Script by cyrielo(m): 8:10am On Sep 04, 2014 |
Olyboy16:Nope it fairly easy and straight forward. visit w3school in the css section look for image sprite. there is a tutorial there |
Re: Please Help On How To Insert Smiley In An Output Text In Java Script by davroca16(m): 1:11pm On Sep 06, 2014 |
Thanks peeps, for trying to help me. I figured out a way of doing it with java, and its sooo easy. Its simple: smile = smile.replace("symbol","<img src=\"resources/images/smiley.png"\ />" ; The above block of code uses the replace method of the string class to replace the smiley symbol with the smiley. It has two parameters; the first parameter collects the smiley symbol to. Be searched for, and the second one collect the img element of an xhtml document that specifies the directory of the image. |
(1) (Reply)
Using The .htaccess file to improve your website / 8 Ways To Become A Better Coder/programmer / I Am Currently Facing The Biggest Challenge In My Life Right Now As A Programmer
(Go Up)
Sections: politics (1) business autos (1) jobs (1) career education (1) romance computers phones travel sports fashion health religion celebs tv-movies music-radio literature webmasters programming techmarket Links: (1) (2) (3) (4) (5) (6) (7) (8) (9) (10) Nairaland - Copyright © 2005 - 2024 Oluwaseun Osewa. All rights reserved. See How To Advertise. 20 |