Ok, as i said before, i will make an article about what option you have when you want to use a carousel. As a jQuery user as I am, the first option i have is Sorgalla’s Carousel. It’s pretty easy to use but has some disadvantages:

• big size - around 50k, maybe more, without another 20k for jQuery
• some IE6 problems - yes, IE6 still has a huge market share. We still need to pull out our hair to make this piece of crap display good all pages
• you cannot highlight current tab - if you want to use it as a tab pagination, you simply cannot highlight selected tab. Or current page.

So, on an older project of mine, i wanted to use a very light script for doing this. Because i was in a really rush, i didn’t focus on unobtrusive scripts so i put some inline javascript (yes, shame on me).

1
2
3
4

<div id="slideCtrl">
 <a class="s1 s" onclick="showSlide(1);return false;" href="#">Tab 1</a>
 <a class="s2" onclick="showSlide(2);return false;" href="#">Tab 2</a>
 <a class="s3" onclick="showSlide(3);return false;" href="#">Tab 3</a></div>

Ok, this is for control. The most important thing is that you can put this ANYWHERE in your page. For example, you can put controls on header and slider on footer of your page. Only your imagination is the limit.

The next thing you have to do is to put some markup:

1
2
3
4
5
6
7
8
9
10

<div id="slider">
<div class="slider">
<div class="slideWrapper">
<div class="box">Tab 1 content</div>
<div class="box">Tab 2 content</div>
<div class="box">Tab 3 content</div>
</div>
<!--/.slideWrapper--></div>
<!--/.slider--></div>
<!--/slider-->

This script also has some limitation:

• You can have only one on page;
• Is pretty obtrusive;
• Doesn’t do auto slide. Of course, you can set a timer for this, but i wanted an easy example.

The next thing we have to do is to set some CSS.

Width and height for carousel:

#slider {
	width:674px;
	height:185px;
}

(more…)

Today it seems that it’s a big day. First of all, i redesigned my blogs. Both have same design (and i’m proud with this ). And second, Adobe launched a beta version for Dreamweaver CS4, Fireworks and Soundbooth. I won’t comment for FW or SB, because i’m not a design-the-web guy or let’s-mix-all-sounds-in-the-world guy, but let’s see some of the features of DW.

So i downloaded, and i start to install. The process was unexpected FAST. I mean any CS3 product take a LOT of time to install, but this was… wow. In less than 2-3 minutes was done:

First thing i said: OMG, 64bit version! I’m on Vista 64 (i have a lot of Gb of RAM and i don’t want to be wasted on 32 bit version ) so that was a pretty big surprise for me. I knew that Photoshop CS4 will have a 32 bit version, but i didn’t expect to see this on a beta version of DW.

(more…)

On my other blog, i made a JS script that allows to add selected text on the comment box (after pressing Q). After redesign, i didn’t wanted to use that same old way, so i wrote a little plugin. Actually, you need some awesome imagination to name this plugin

Anyway, you can download this plugin from here and activate in the old fashion way (admin-> pluggins -> look for NtzAutoquote and press activate). How to use it? Very simple: select the text you want to quote and press Q key. In this way, you avoid to write over and over again <blockquote> </blockquote> when you want to quote some comments.

You want a demo? Try it right here! Select ANY text that you want, press Q and check out the textarea on the comment form With all these, there is a limitation tough: you can have only one textarea on your page. I did it in this way because some theme developers don’t keep the name/id’s on forms when they develop themes. If you have more than one textarea, ask here and i will be glat to help you.

Well… I put my non-designer skills on work and this is what i got. A nice and clean (or at leas i hope so) brand new layout for this great blog.

I spend last night on CSS Galleries for inspiration, the whole day for design and this night (actually few hours) for slicing and implementing the new masterpiece

So. What do you say guys? Should i start to design too?

Ok, as I’ve said HERE, my great psd slicing tutorial is done. Please note that it is my very first video tutorial so I’m sorry for this things:

1. If I cut out too much parts (yes, some parts like ALT-TAB window, start menu showing, and so on are missing). I considered that those parts are not essential so, to reduce size, I’ve cut them out.
2. If it’s taking too long. The tutorial consists in two parts, both are around 30 minutes. I wanted to play them at 150-200% speed, but I quit. I offer a download alternative (besides the online playing), so you can download files and play them in your favorite media player with higher speed.
3. If I have language errors. English is not my native language, so I made mistakes. Some mistakes I’ve seen, some not. But it takes way to long to edit the videos again and again. I consider that errors are acceptable because the final result (which is that you understand how it’s made) is more important.

Download:

Part one Part two. Great for offline views.

Files used in movies: HERE.

EDIT: Because i received complains about codec and browser crash because of videos, i put only FLV version. If you prefer, under each player, you find a link for VMW version (which have waaaay better quality).

Part one

VMW version, higher quality.

Part two

VMW version, higher quality.

I use E-texteditor, which is THE BEST editor i ever seen, so don’t worry if things appear from nowhere. Is just my snippets.

READ THIS PLEASE

I really need feedback on this movies, because i want to know if i should continue or not on creating (video) tutorials. So, you like it? If you don’t like it, what was wrong? What is missing? And the most important: did you understand what’s happening there? After you did this tutorial, you are able to make this on your own?

Thanks and enjoy!

I almost forgot.
The host for videos is provided by Miodrag, because on my host i have limited amount of both space and bandwidth.