Posts

Showing posts from November, 2013

Three Sided Border and Different colors for Border

If you need to put a border on only three sides of an element, there are a bunch of ways you can do it. You can specifically declare the border on just three sides: div { border-top: 1px solid red; border-right: 1px solid red; border-bottom: 1px solid red; } Verbose, but easy to understand. Or, you could declare just a border which will cover all four sides and remove the one you don't want. div { border: 1px solid red; border-left: 0; } Much shorter, but relies on understanding and maintaining that the border removing override is kept after the border declaration. Or, you could declare the color and styling and use shorthand only the border-width to specifically declare the three sides. div { border-color: red; border-style: solid; border-width: 1px 1px 1px 0; } Shorter than the first example, but less repetitive. Just need to be aware if left border did acquire width it would already be red and solid. And then there is the fact

Change Default Date and Month in Jquery Data Picker

We can change default date display date in jquery data picker as we wanted like moving months back and forward and displaying particular date. As we all know script for jquery date picker, I'm just recalling the script again. $(function() { $( "#datepicker" ).datepicker(); }); Following shows some examples for changes defaults options. $(function() { $( "#datepicker" ).datepicker({ defaultDate: '-2m' }); }); Above code changes the default month to previous two months. Example, if we are in November I'll show us the month of September.  By passing in a string like following ways, we can set the default date to another one relative to the current date. Alternatively, the option also accepts a Date object: or a string in the same format as the format currently defined: defaultDate: '1/9/2010' $(function() { $( "#datepicker" ).datepicker({ defaultDate: new Date('2013,05,01') });

User Avatar Image and User name and Email in LIferay Theme

It's possible to add logged in user image to Liferay portal. We need to add this in themes. Add the following line of code to portal_normal.vm file or any of the velocity file(.vm) where ever the user image needs to diplay. <img src="/image/user_male_portrait?img_id=$user.portraitId&amp;" alt="User Name" width="25"> You can change the width of the image as per your requirement. You can get the user name and user email address with the following code. $theme_display.getUser().getFullName() - This will give us Logged in user full name; $theme_display.getUser().getDisplayEmailAddress() - This will give us Logged in user email address.

Simple Jquery Toggle

Image
Description: The  toggle( speed, [callback])  method toggles displaying each of the set of matched elements using a graceful animation and firing an optional callback after completion. Syntax: Here is the simple syntax to use this method: selector .toggle( speed, [callback]); Parameters: Here is the description of all the parameters used by this method: speed:  A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000). callback:  This is optional parameter representing a function to call once the animation is complete. Example: Following is a simple example a simple showing the usage of this method: <html> <head> <title>the title</title> <script type="text/javascript" src="/jquery/jquery-1.3.2.min.js"></script> <script type="text