Category Archives: jQuery

How-to for jQuery

How can I use CSS:before to add new line

CSS, HTML5, jQuery

CSS logoHow can I use CSS:before to add newline before an element???

That is the question that I researched today. My answer was semi-satisfying. I found that you can, and can’t do it … kinda.

What does that mean? Well, the intuitively obvious ways don’t work. The CSS method I did find will work on all browsers except the wonderful IE browser. What else in new! Love you IE …

In my situation, I wanted to customize where a link (<a>) was sitting. It was embedded in generated text I couldn’t touch. I wanted the link on the next line to highlight its existence.

I tried several things that didn’t work and wasn’t surprised by the results:

  • does not work, not a surprise.
  • doesn’t work, the content is processed as text, not as a tag.
  • failed as badly as the others … not a surprise.

What surprised me was the following works, on browsers other than IE:

There is no CSS solution, but, there is a jQuery solution. Try jQuery:

  • $(“<br/>”).insertbefore(“a”)

jQuery Ready() Initialization

jQuery

Using jQuery initialization

jQuery logojQuery offers a very convenient method to do JavaScript initialization. Many JavaScript and jQuery statements require existence of site elements and tags, and can not be run until after the elements and tags exist. Some use the onload attribute of the tag. To some, this implies moving the running of the JavaScript or jQuery initialization to the end of the page. However. JavaScript and jQuery offer other methods that solve this problem. They provide methods to run initialization after the DOM hierarchy has been initialized.

jQuery’s ready() works great to permit the defining of initialization functions and then executing these functions when the DOM is ready.

A reason to use the jQuery ready() initialization rather than javascript.onload() or placing the onload in the body tag … jQuery allows you to create initialization tasks wherever it is best encapsulated with the code it supports, yet it is gathered together with all other identified initialization activities and executed as a group when the DOM is ready.

To use jQuery ready(), wrap your initialization activities in the ready wrapper as follows:

 

Shortcut for jQuery Ready() Notation

Alternately, you may use a shorthand notation to run an initialization by invoking initialization handling as follows: