Home > JQuery > Text Effects In jQuery

Text Effects In jQuery

Font Effect with JQuery : We can use sample code for font effect by JQuery.

Font effect is a jQuery plugin that add some effect to html text.
The available effects are (for now) Outline, Shadow, Gradient and Mirror, here is an example:

download the plugin here

Below Code :

<!DOCTYPE html>
<html lang=”en”>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″>
<script src=”http://code.jquery.com/jquery-latest.js”></script&gt;
<script type=”text/javascript” src=”js/jquery-1.3.2.js”></script>
<script type=”text/javascript” src=”js/jquery-FontEffect-1.0.0.min.js”></script>

<script type=”text/javascript”>

$(‘#example1’).FontEffect({ shadow:true, shadowColor:”#f00″, shadowOffsetTop:4, shadowOffsetLeft:4, shadowOpacity:1, outline:true, outlineColor1:”#fff”, outlineWeight:2 })

$(‘#example2’).FontEffect({ outline:true, shadow:true, mirror:true, gradient:true, gradientColor:”#f00″ })
$(‘#example3’).FontEffect({ gradient:true, mirror:true, mirrorColor:”#298d79″ })

<style type=”text/css”>

#example1{ font-family :”verdana”; font-weight :bold; color :#5a7; font-size :3em; }
#example2{ font-family:”Arial”; font-weight:bold; margin-bottom:30px; font-size:60px; color:#fff; }
#example3{ font-family:”Impact”; font-size:3em; margin-bottom:30px; color:#9ae; }



<div id=”example1″>
Enter Your Text Here

<div id=”example2″>
Mohammad Arif Hossen

<!– Gradient &amp; Mirror  –>
<div id=”example3″>
Jquery Text Effect


Categories: JQuery
  1. January 13, 2010 at 6:57 am

    nice arif!! I will try it soon 🙂

  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

%d bloggers like this: