Protected: Learnings at Oracle
November 6, 2008 at 9:44 pm (Learning at Oracle)
Tags: install, oracle learning setup open source
IE issue- ENTER does not work ?
September 29, 2008 at 9:28 pm (Learning at Tacit)
Tags: ENTER, IE issue
IE bug- If your page has a Web Form with a single TextBox Web control, your user's visiting
with Internet Explorer won't be able to have the appropriate action be completed upon hitting
enter in the textbox.
Workaround -simply add another TextBox Web control to the Web Form. This will cause Internet
Explorer to send back the Button Web control's name/value pair upon hitting Enter. Of course,
you don't want the user to see two TextBoxes, so use a bit of CSS to hide the second one.
(Acknowledgement- http://aspnet.4guysfromrolla.com/articles/060805-1.aspx)
page refresh for javascript
August 21, 2008 at 7:23 pm (Learning at Tacit)
Tags: javascript reload
1. To refresh the current page, use this code-
<a href=”JavaScript:location.reload(true);”>
Refresh this page
</a>
or just -(within javascript code)-
location.reload(true)
2. To compare 2 files, windiff is a great tool !
Issue with Yahoo groups unicode broadcast
July 18, 2008 at 6:43 pm (web)
Tags: Issue yahoo groups unicode
I am a member of a yahoogroup which uses unicode to communicate (in Hindi).
Recently, I found a bug.
To avoid getting multiple mails , I subscribed to the web read only feature but when I tried to respond to any entry from the site, the unicode got messed up.
But when I subscribed again to the individual emails and tried to respond from my inbox the unicode was perfectly rendered.
Could yahoo people please try to fix this bug?
Thanks so much,
Archana
Issue with ‘onEnter’ on a formless text box
July 18, 2008 at 6:39 pm (Learning at Tacit)
Tags: form elements enter refresh
Recently, I had issues with a set of text boxes which were not within a form. The onEnter (when pressed enter) on any of the text boxes would refresh the page as it was considered a submit by default.
This was causing problems in the page where I had an AJAX application.
So, we need to cancel the event trigger by ‘enter’.
This is done by the following line- the ‘enter’ is code 13 on the keyboard – (in the element like text box)
onKeyPress=”return event.keyCode!=13″
Format Conversions
May 14, 2008 at 11:43 pm (Audio-Video works!)
I like editing audios and videos but I’m not a professional multimedia person. I’m learning small things which I would like to share with you. Hope it helps.
1. How to make a wmv from a vob file?
Almost every finalized video is in the vob format. To make it in the wmv format, one can use one of the many software available in the online market. One of them is AOA DVD Ripper which is free till your file time span is less than 10 minutes. So, make sure you cut your video within 10 minutes. This can convert any video format to any other format. Amazing speed !
2. How to make a MP3 out of an audio file & vice-versa?
To convert an audio file to an MP3, you can use -
the Alto Mp3 convertor
but it is free till your CD song number is less than 12 beyond which you have to buy the software for just $20.
To convert MP3 back to audio format, just drag & drop the MP3s in the Windows CD burn library. It’ll convert it automatically before making the audio CD!
IE6 issues – Learnings at Tacit
May 14, 2008 at 11:30 pm (Learning at Tacit)
Tags: IE6 issues float position
A couple of new web learnings at Tacit-
1. For IE6 issues, instead of using hacks(* or _), put the differential code for iE6,
as is given by Microsoft.
<!–[if IE 6]>
<style>
#selector,
#shield { position:absolute; }
</style>
<![endif]–>
3. “Float” does not work nicely in IE6. We need to put some workarounds for that.
4. For a check-box, you should have either checked=true or nothing at all. Having checked =false does not work in many situations
5. IE6 does not understand “position:fixed”. As a workaround, you have to play with the z-index of the container & its parent.
6. The z-index of the controls (drop down menu boxes ) are always higher than the pop-ups . So, they might show up.
7.when you make an image an anchor, there is a default border which shows up.
You should put a border:0 to make the border disappear.
Learnings at Yahoo! (Archived)
May 14, 2008 at 11:28 pm (Learning at yahoo)
Tags: web develepment
* Good Web Practices
* Accessibility Issues
* Web dev Tools
* Hacks and Filters
* Some known bugs & their solution
* Questions to ponder-
* Cross Browser compatibility- After designing the webpage from mock ups, check it on all browsers- Firefox, IE7, IE6, Opera, Safari (Mac). You can install multiple versions of IE from this site- http://tredosoft.com/Multiple_IE
* Graceful degradation – Check the page after disabling JavaScript and CSS. The content should not get bad after disabling.
* Progressive enhancement- Start with the basic and add the styles gradually making sure that it does not break in other browsers.
* Put Semantic markup(meaningful tags) so that some styles show up even if the CSS is OFF.
* Put the common styles on higher elements to avoid repetition.
* Specificity- The styles possess weights/points corresponding to their proximity to the element, their position in the style scale (user defined, external, internal, inline etc).
* Resolution compliant- Check the web page(s) in different resolutions. To change the resolution of your computer (for windows only), please refer to http://www.microsoft.com/windowsxp/using/setup/personalize/resolution.mspx
* Fluid layout – The content should be flexible/ fluid if the browser size is increased or decreased.
* Re-Usable Imagery- Put borders, backgrounds, navigation bar buttons etc in a manner which could be re-used irrespective of the content or the size of the font.
o Sliding box technique- 2 congruent boxes sliding apart when contents increase (vertical or horizontal)
o Box-cap technique-top and bottom OR left and right, the right image caps till the area required for the box.
o Re-Usability – Use one image for drop down menus. Just position it differently.
* Organize – Keep the 4 parts of the page separate- Content (XML), Structure (HTML), Presentation (CSS) and Behavior (JavaScript).
* Small tips to fix big issues- Good Coding Habits-
o Put a space before starting the “{” in the style sheet.
o Always end the style with a semicolon ;}
o Use all small case unless you are camelCasing a name
o Put the style pertaining to a page/ block with a distinct prefix so that it does not mess other selectors with the same name.
o If there is no text within any element defined by the CSS (like div, p etc) it will not show up; not even the background image. To show it, put some width or height to it.
o Do not give height to a box which might expand later. Instead try to use min-height.
o (Usually) after the page is submitted, the only changes that could be done are the style/CSS changes in the CSS.
o For the images that needs to be changed often, img src is good other wise you can use background to put an image in the page by the CSS. It need not be in the HTML.
o Anchors with ‘text-decoration:none’ should show the underline when hovered
o For meta refresh, for the given redirect URL, put URL= to make it work in IE
Go to Top.
Accessibility Issues
* Put title, alts, and captions for every image.
* Try to put the micro format structure like vCard, vCalender etc. These are machine readable syntax.
* The page should be navigable without using mouse- put tab index.
* The page should not break when you make the font size bigger or smaller (CTL+ or ctrl -).
Go to Top.
Web dev Tools
* Debugging tools-
o For Firefox- Firebug- Helps to debug the HTML code, the CSS and also the Javascript in the page. It enables to see the update on the page when the values of the attributes/selectors are edited.
o For Firefox- Web developer tool bar This can aid in reviewing the page with or without the CSS, the javascript and other assets. It also
o For IE- Visual Web Dev -
* Measuring tool- MeasureIt- This is a firefox addon and can be downloaded from – https://addons.mozilla.org/en-US/firefox/addon/539
* FTP tool- WinSCP for Windows- This free ftp tool can be open a session in Putty – for Unix operations and open the files in editors like Text Pad , DreamWeaver etc
* Editing tool- Dreamweaver, TextPad -These tools can color code the source code which makes it readable. DW also has other features which make coding convenient and less error prone. Like- auto completing of the code, Apply source format ( which makes the code approprately indented) etc.
* Color code – Identifier & Comparison tool – Color Schemer- It is a paid software but very useful.
* Graphic editors – Photoshop
Go to Top.
Hacks and Filters
Different browsers have special filters which apply only to them. We can use them to customise our page for
* IE7 – * -Use star to filter the code for IE7 only
* IE6 – _ -Use underscore to filter the code for IE6 only
* @media -Use this code to filter the code for Opera only
*
Go to Top.
Some known bugs & their solution
* IE – Box model issue- IE considers the padding of the box as a part of the width. This might pose problems in the actual sizing. Solution- Keep the width & the padding in separate elements.
Go to Top.
Questions to ponder-
* Why we should/ should not use import@ instead of for CSS?
* Why we should/ should not use “expressions” for IE purposes? (Is it a good idea to have logic/javascript in CSS?)
* What are the issues with alpha transparencies?
* Why IE messes up with double class nomenclature?
* Where should we use a light box model ? (Using Opacity & Z-Index)
* For a drop down menu designed in CSS, how can we avoid the display none of the drop down menu on mouse out i.e, when the mouse is on the menu ?
Go to Top.
Yahoo! Specific Learning (YUI)- CSS
* For cross browser CSS, use the Yahoo! CSS-http://yui.yahooapis.com/2.4.1/build/reset-fonts-grids/reset-fonts-grids.css. This resets the default styles in all browsers and then we can set new styles as per our designs.
Yahoo! Specific Learning (YUI)- Javascript
* For DOM , use the api-
Some common commands for using Putty/CVS/ YALA (Yet Another Language Automation )tool
*
o Navigation – After logging in,to go to the CSS files, type cdc followed by the country name. e.g. cdcus for U.S., cdcar for Argentina etc. To go to the generic intl, type cdc.
o Regeneration – To regenerate the files, type ygc followed by the country name. e.g. ygcus for U.S., type yga to regenerate all intls.
o Check out – To synchronise/update your code with the latest code on CVS-
+ cvo – to update all files. This has yga built built in the function.
+ cvs up on a particular folder/file. You have to do a ygc followed by the particular country name to regenerate it.
o Check in – To check in your code, use cvs ci -m ‘comments about the update here’ fileName
How to akamise images on the HTML server.
* Akamising is the process of putting images in the HTML server which can be accessed with a URL. Here is the process-
o Upload the images in the correct folder by WInSCP ot any other ftp tool.
o Run “gmake” in the respective folder.
o Use the absolute URl to the image in the CSS. If there is a variable- “image_path” or “image_path_all” which generalizes the path, use it.
