Ștefan Nicolae » javascript http://www.stefan-nicolae.ro/en Just another unleashed web programmer Fri, 06 Jan 2012 14:59:55 +0000 en hourly 1 http://wordpress.org/?v=3.0.1 jQuery fader http://www.stefan-nicolae.ro/en/2010/06/jquery-fader/ http://www.stefan-nicolae.ro/en/2010/06/jquery-fader/#comments Wed, 23 Jun 2010 08:47:31 +0000 stefan http://shakabut.com/?p=157 Alex needed a little image fading effect for his blog. As an example, he gave me a nice Earth Hour gallery (i think it was the boston.com Earth Hour 2010 article). The idea is to overlap 2 images and provide a fading effect when the visitor clicks them. I'm sure there are hundreds of scripts that do the exact same thing, but I proffered to write the 10 lines of jQuery code myself. ]]> My friend Alex needed a little image fading effect for his blog. As an example, he gave me a nice Earth Hour gallery (i think it was the boston.com Earth Hour 2010 article). The idea is to overlap 2 images and provide a fading effect when the visitor clicks them. I’m sure there are hundreds of scripts that do the exact same thing, but I proffered to write the 10 lines of jQuery code myself.

Here’s an example of the effect: http://shakabut.com/examples/jqueryFader/.

This is the little piece of code:

<style type="text/css">
   .pictureFaderBox{
      margin:0 auto;
      cursor:pointer;
      width:640px;
      height:427px;
      clear:both;
   }
   .on, .off{
      position:absolute;
   }
   .on{
      z-index:10;
   }
   .off{
      z-index:5;
   }
</style>
<script type="text/javascript">
   $(document).ready(function() {
      $(".pictureFaderBox .on").toggle(
         function () {
            $(this).animate({opacity: 0}, 900 );
         },
         function () {
            $(this).animate({opacity: 1}, 900 )
         }
      );
   });
</script>

Also, please check Alex’s post to see a great photo project: http://3punctefoto.blogspot.com/2010/06/pitestiul-urbanizat.html. The post is in Romanian, but the pictures are not :) – don’t forget to click the images!

PS: If you like nice interface elements, check our web agency website and contact us.

]]> http://www.stefan-nicolae.ro/en/2010/06/jquery-fader/feed/ 0 To my/our/your IE6 users http://www.stefan-nicolae.ro/en/2010/02/to-my-our-andyour-ie6-users/ http://www.stefan-nicolae.ro/en/2010/02/to-my-our-andyour-ie6-users/#comments Thu, 11 Feb 2010 08:47:15 +0000 stefan http://shakabut.com/?p=61 I was thinking to write a script that prevents IE6- users to see the sites I’m developing a long time ago, but I never seemed to have the time.

Fortunately a nice guy (I think his name is Mihai Ile) did, so he wrote this little script “that displays a warning message politely informing the user to upgrade the browser to a newer version (links to newest IE, Firefox, Opera, Safari, Chrome are provided)”.

Thank you Mihai! Thank you in the name of all frustrated web developers, who spend their precious time downgrading their code to support IE6 or explaining their customers and visitors why it’s not a good idea to use a browser that was produced 9 years ago.

Also, thanks Mirel for the link!

Update: Smashing Magazine published a nice  comic-book-like story about IE6. You might wanna check that too…

]]> http://www.stefan-nicolae.ro/en/2010/02/to-my-our-andyour-ie6-users/feed/ 0