CSS: Movement without javascript??

This is just a nice example of the CSS power. Actually, and the most amazing of this example is the use of CSS 1!!!, just that, ..although in one example there is an attribute used at CSS 2.

It works in all major browsers but in IE6, ...you already know how complicated was that version..

The creator of these examples is Román Cortés:

Paper Bird.
Coke Rotating.

At any case, and although the effects are really cooool, what has happened with 3D Programming?? hmmmmm, do u know js3d??, it lets you achive things like this.

TOOLS: Thumba, online image editor

Most of you can think somethink today "I hate mondays!!!", ..but hey, it is better to think something like "Cool!!, a new Post from Sepelka, a new day to code and only 4 days for next weekend!!!".

Still using paint shop pro, photoshop, ...or another pay per use Software??. Well done if you work manipulating images but for just posting images into blogs, resizing them, etc, you better use online and free tools, unless you don't mind to pay to use fabulous paint shop pro!. I am going to introduce you to Thumba, an online software based on silverlight, ...sorry for linux users because moonlight will not work ..unfortunatly.

What can we do to our images with Thumba besides coping, paste, cropping, rotating..?, ..many, many stuff as for example bluring, hue, saturation and ilumnation adjustion, Brightness, contrast, gamma correction.. Ok, ok, that doesn't seem to be a lot for an Image Editor Application, but what about effects like:

• Old Paint
• Pencil Sketch
• Pop Art
• Stamp
• Blur (Zoom, Focal, Radial, Smart....)
• Crazy Distortion
• FishEye Lens
• Explosion Distortion
• Effects as Sepia, Sunny day, Solarization.....
• Wave Effect
• Ripple Effect
• ..and many, many more!!!.

Some as cool as converting this image of me looking at a duff beer into Ascii Characters..


And yes all for freeeeeeeeee, as you like ;)

TOOLS: Firebug for IE, Opera and Safari

For web development there is one very important tool called firebug!!.It is used by almost any webmaster to debug CSS, HTML and Javascript code. This tool brings inspection, debugging an supervision through mozilla browser.

..but hey it only works for firefox as one of its extensions, but what happens when you need to test your pages in Internet Explorer, Opera, and Safari? ..hmmm, well for Safari you can drag the Web Inspector button to your Safari toolbar from the customize toolbar option...



...but for the rest?. Well, we are lucky, because it comes firebug lite. To use it you have to add a link at the favourite toolbar as a bookmarlet. This link contains javascript that will excecute remotely firebug!!. All the instructions will be found at the firebug lite homepage. Thanks firebug!!!



Today I feel happy, in fact having a a little glass of macallan and smoking a larisian cuban Cigar i have had for a present (I never smoke...) so I leave the best 2009 song for me to all of you!!!. Milow - Ayo Technology

CAPTCHA: New Captcha based on Video

..One of my favourites phrases is "Life is Easy, but we, the people, make it hard!!", ..why do I say this??. Well, just because everytime we find more barriers to do normal task, for example filling up a form and "the captcha"!!.

Everytime you are introducing data into a form, the captcha appears to know if you are human. Why??, because somebody liked to make a program to fill up automatically forms for bad porpouses.. But Captcha, as any barrier is being broken, ...again to make things harder..., so what's next?? 3D Captcha?? :), ..errrr, sorry, that question has a "YES" answer??...

A group of people at Tel Aviv University has comed with a new development to have a dinamic 3D Captcha, which integrates blur and noise to an animated image in a way that a human being can see what's behind that "curtain of noise" but your inteligent PC will not be able to know it. An example here:



And yes, you will need to do both, get blind trying to get the figure in movement and answering the question as it already happens in some captchas, as well as adding this tech to your forms at your sites!!. This new Captcha system based on video is still on development, ...but keep an eye on it..

JQUERY: Multilevel Tree Menu Plugin!!

Now its time to have a Multilevel Tree Menu with Jquery!!!.


It builds a menu from a table as this for first level, although also a list should work:

<div class="myMenu">
 <table cellspacing='0' cellpadding='0' border='0'>
  <tr>
   <td menu="menu_1">Freakzion</td>
   <td menu="menu_2">PressXine</td>
   <td menu="menu_3">Jquery</td>
 </tr>
</table>
</div>

and rest of level for option menu_1 should be as this: (different examples)

<div id="menu_1" class="menu">
  <a rel="title" >title menu_1.1</a>
  <a href="../mb_carusel/carousel.html"
   target="_blank" img="image.gif" >menu_1.1 (href)</a>
  <a action="document.title=('menu_1.2')">menu_1.2</a>
  <a rel="separator"></a>
  <a action="document.title=('menu_1.3')" disabled=true>menu_1.3</a>
  <a action="document.title=('menu_1.4')" menu="menu_1" 
   img="image.png">menu_1.4</a>
</div>

To gererate the menu from this just execute the next method for the element (in this case "myMenu"):

$(".myMenu").buildMenu(
{
template:"menuVoices.jsp",
additionalData:"",
menuWidth:200,
openOnRight:false,
menuSelector: ".menuContainer",
iconPath:"ico/",
hasImages:true,
fadeInTime:200,
fadeOutTime:100,
adjustLeft:2,
adjustTop:10,
opacity:.95,
shadow:true,
closeOnMouseOut:true,
closeAfter:500,
minZindex:200,
hoverIntent:0
});

The details for each of the options of the method are totally describe at the plugin page.

As usual do no forget to include at the HEAD of your html the javascript and css files:

<script type="text/javascript" src="inc/mbMenu.js"></script>
<script type="text/javascript" src="inc/jquery.hoverIntent.js"></script>
<script type="text/javascript" src="inc/jquery.metadata.js"></script>
<link rel="stylesheet" type="text/css" href="css/menu1.css" media="screen" />

I miss some examples of styles change and possibilities, as well as it is a bit heavy library, ..but as usual sneak into de code and say thanks to its creator!! :)

WEBSITE TOOLS: HootMonitor, monitorize your site

I am sure all of you are not all the time over your site checking the availability of it, ..many things to do just for that!!. But what if youR site is down for a period of time??, ..hmmm, would you like to know ASAP to solve the problem???. I am sure the answer is YES!!. Here is a tool, HootMonitor, that may help you!!. If your site is down, then you will receive a twitter message!!, and for sure you have twitter integrated in some tool at your desktop or mobile phone to be always online...And this is not only its features. You can have:

• Stats
• Reports
• RSS Feeds
• ...

There is a free version which will allow us to register 3 websites but with premium access you will have even alerts via SMS, detailed stats...

A CHEAP service which by the way is still at Beta Version...