Archive for category Javascript

3 ways to add the jQuery library on your site.

Hello,

In this post i’ll show 3 ways to load the jQuery lib in your site. Let’s go:

1. Loading locally

To use this method you have to download the last version of jQuery library in your official website in this link: jQuery lib.

And to load in your HTML code, use like that:

<script type="text/javascript" src="path_to_you/jquery-latest.js"></script>

2. Loading online: first method

To  load online directly in the first method you’ll load from the official jQuery site, from a direct link provided by them.

Your code have to be like this:

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>

3. Loading online: second method

The second method to load a online hosted jQuery lib is load this from ajax.googleapis.com.

Your code have to be like this:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>

That’s it! If you know another way to do this tell me on contact that i add in this post with your refference 😀

See ya

Advertisements

Leave a comment

prettyPhoto: Powerful jQuery lightbox for almost anything

Hey every one,

Today i’m searching for a cool lightbox to a project and i found this:
http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/

His name is prettyPhoto and it’s a amazing jQuery based plugin easy to use and functional to add a lightbox for some content. Less than five minutes it’s possible set up for a:

  • image gallery
  • flash content
  • youtube content
  • vimeo content
  • quicktime movies
  • external sites
  • inline content.

A simple example to use it:

Insert it in <head> tag:

<script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>
<link rel="stylesheet" href="css/prettyPhoto.css" type="text/css" media="screen" charset="utf-8" />
<script src="js/jquery.prettyPhoto.js" type="text/javascript" charset="utf-8"></script>

And in the image or another one media, you have to do the link like this:

<a href="pathtoyou/bigImage.jpg" rel="prettyPhoto"><img src="pathtoyou/smallImage.jpg" title="Insert the legend here" /></a>

If you want to do a gallery you have to add a gallery name like this:

<a href="pathtoyou/bigImage.jpg"  rel="prettyPhoto" rel="prettyPhoto[galery_one]" ><img src="pathtoyou/smallImage.jpg"  title="Insert the legend here" /></a>

You you can use all of that in a unique gallery or many galleries and if the image is big the prettyPhoto plugin show an icon to maximize the image (like a flash full screen, but in an image).

more.. this jQuery plugin based have some options to edit and you can create skins for it! Without talk about your documentation that is very rich and easy to found anything about that.

I recommend, if you want to use lightbox don’t have questions, use this! Is very cool!

Visit, read, learn and download in http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/

, , ,

4 Comments

Note

This is a temporary blog! Not my official web adress..

The brunoteixeira.com.br i`m making 😉

so, enjoy it for now

Leave a comment

%d bloggers like this: