All-In-One Slider a jQuery plugin

jQuery has changed the way users interact with websites. jQuery Image sliders are become increasingly popular within webpages. I’ve created a Slideshow widget All-In-One. As I’m calling it All-In-Oneso I hope almost all jQuery slider features you will find here. And Of course some new features which you may find interesting.

a jQuery Plugin for image Slider

All-In-One Slider a jQuery Plugin

Features

  • Any types of content are possible to add.You can add Images, Plane text, Html content, videos what ever you want to slide
  • Display Multiple Items TogetherYou can display multiple items in column or row direction. So in a single box people can see multiple items together. Usually very useful in product display purpose.
  • Display your content in Two Dimensional ViewYou can give All-In-One slider a two-dimensional view. All you’ll have to do is add Column and Row number. How many column and row you want to use per movement.
  • Accessible Auto-Playing Slideshow Feature.Auto-playing feature included. Which is user accessible You can change auto play directions. Like Left to Right or Right to Left etc also you can disable auto-playing slideshow option if you don’t like it.
  • Number Of Items Move/Scroll Per Click/MoveYou can control the number of items which you want to scroll per click or when auto-play is going on. Just like in jCarousel.
  • Animation Speed Control.You can control animation speed. So if you want to move your content Faster/Slower you can adjust it.
  • Mouseover Pause During auto-play if you want to see what is the item is then just move your mouse over the item and autoplay will pause.
  • Overlay Caption For ImageYou can add a overlay caption with images, for showing title or meta content.
  • All Options are OptionalYou can just add more than a few words $(DIV NAME).all-in-one({}); to make All-In-One slider works, if you don’t have much time to add options. It will work fine. Although options will make it perfect 🙂

How to Make this Work

  • HTML Markup


<!-- All-in-One Slider's HTML Markup -->
<div id="any_name">
<div id="another_name">
<ul>
	<li><img src="myImg/01.jpg" alt="" /></li>
	<li><img src="myImg/02.jpg" alt="" /></li>
	<li><img src="myImg/03.jpg" alt="" /></li>
	<li><img src="myImg/04.jpg" alt="" /></li>
	<li><img src="myImg/05.jpg" alt="" /></li>
</ul>
</div>
</div>

  • CSS


/* All-in-One Slider's CSS */
#allinone-frame{
width:500px;
height:238px;
margin:0 auto;
background:#242424;
overflow:auto;
}

#allinone-content{
position:relative;
margin:0 auto;
width:60%;
color:#fff;
background:#3d3d3d;
}

#allinone-content ul{list-style-type:none; }

#allinone-content li{ margin:8px; float:left; }

/* change width or height value if you want */
#allinone-content li img{
width:256px; height:192px; /* (important) need to be same as your images width & height */
}

#allinone-meta-content{
height:40px; position:relative; margin-top:-46px; color:#fff; background:#000;
font-size:11px;
filter: alpha(opacity=60);
-moz-opacity: 0.6;
-khtml-opacity: 0.6;
opacity:0.6;
padding:2px;
}

#allinone-meta-content p{font-size:15px; font-weight:bold; padding-left:2px;}
#allinone-meta-content span{position:relative; font-size:11px; color:#e4ff00; padding:2px; font-style:italic;}

  • Script

// All-in-One Slider's jQuery script

// add jquery library
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.js"></script>// add All-In-One version 1.0<script type="text/javascript" src="jquery.allinone-1.0.js"></script>

$(document).ready(function() {
$('#allinone-frame').allinone({
    autoPlay:true
});
});

Options

In order to make All-In-One looks like your own you can add some options. like..

columnNo : 1, //[1,2,3……; default 1] number of columns, each column hold one item
rowNo : 1, //[1,2,3……; default 1] number of rows, each row hold one item
itemMove : 2, //[1,2,3……; default 1] number of item scroll per click / move
Speed : 1000, //[in milliseconds] animation speed
autoPlay : true, //[“true” or “false”] auto play disable or Enable
animDir : “left2right” //[“left2right” or “right2left”] change animation direction

Questions?

If you face any problem or find any bug please feel free to contact me. Just leave a message here or mail me. I hope you will enjoy it.

VIEW DEMO

DOWNLOAD IT (812 Kb)

Advertisements

UPTODATE

My new site UPTODATE. Finally I finished it!
Now I want to know what you are thinking about my site. Did you like it? 😕
So who want to be uptodate with me. check this out UPTODATE.

My new Site UPTODATE

My new Site UPTODATE


Project AutoVESTS

Autonomous Vehicle System using Traffic Sign Recognition or Auto VESTS.

This is my final year project at university. The concept of the project is – A car which will move and turn different directions without any human support. So, this car can drive autonomously and can detect and recognize traffic sign. Now I want to include some advantages of this project which might distinguish our project from others.

  • One of the major advantage I’d like to add is cost. Our system is very much cost effective and materials which we have used was not expensive at all.
  • For Capturing image from real world we used Mobile CAM. Resolution is a fact but performance moderate so far.

We used several image descriptors for image detection and recognition. Nokia 5800 as webcam. We’ve developed circuit for switching purpose. Parallel port for interfacing system.
Check this video ……….
Click here Project AutoVEST” or,


Presentation on SEA-ME-WE-4

Today I made my presentation at the Fiber optics & Optical Communication Engineering class conference, my topic was SEA-ME-WE-4 (South East Asia- Middle East – Western Europe – 4) and found that I had too much to cover in too little time. Most interesting part was everyone had only 7min time. But I managed to get through it and received some kind remarks from some of those in attendance.

If anyone would like to know about SEA-ME-WE-4 you can download this presentation.

SEA-ME-WE-4
SEA-ME-WE-4.PPT


Game Character Design

During the development of my new flash game The Carpet : Rescue the Kids I needed to create some game characters. At first I thought I will ask my artist friend for this task but at that time he was little busy at office work. So I thought I will make this. Here some characters which I have created. I really wanted to go for a stylized look. At that point I just tried to make the character more suitable for the game. By the way for designing those character I used Adobe Flash and some final touch in PS.

Game Character Design

Game Character for The Carpet


Portrait

A few days ago I have designed some Portraits. Actually our Javed sir asked me to make a plan to celebrate our University Anniversary Ceremony. So, I tried to do something different and just gave this proposal to him. At first he was little bit confused how it will be. So I showed him some sample, then he appreciated it very much. It was an interesting experience for me and a gift from me to those honorable people.
Following are some sample that I have developed.

VC_Ptr

Portrait of Prof. Dr. M. Shamsul Haque Ph.D. (MBS, UK) MBA (IU, USA), M. Com (RU)

Dr. Md. Nurul Islam, Dean, Faculty of Science & Register

Dr. Md. Nurul Islam, Dean, Faculty of Science & Register

Akram_Pttr

Portrait of Prof. Dr. Mir Akramuzzaman

Engr. Md. Badiuzzaman, Head ECE Dept

Engr. Md. Badiuzzaman, Head ECE Dept





Javed Kaiser Sr. Lecturer & Coordinator

Javed Kaiser Sr. Lecturer & Coordinator


Sajed Chowdhury Lecturer Dept. of CSE

Sajed Chowdhury Lecturer Dept. of CSE

And finally as I’m not an artist or professional designer so I maybe complete blunder in this section 😛 . I would like to thanks those people who helped me to make this possible.


Outliers, The Story Of Success

I just finished one of my favorite book which I’ve read in a long time. Yes, Outliers : The Story Of Success, by Malcolm Gladwell. You know, finishing a book is just like you took a child out in the back yard and shot it.

Outliers : The Story Of Success by Malcolm Gladwell

Outliers : The Story Of Success by Malcolm Gladwell

So I would like to share my feelings about this book.
According to Wiki,
The publication debuted at number one on the bestseller lists for The New York Times and The Globe and Mail on November 28, 2008, holding the position on both lists for eight weeks straight as of January 16, 2009.

If you would like to take a quick look then I will suggest you don’t miss those …

  • The Matthew Effect
  • The 10,000 Hour Rule
  • The Trouble with Geniuses Part I , II
  • Rice Paddies and Math Tests [Most interesting for our country ;)]
  • A Jamaican Story

So, those who want to be successful and those who already successful and those who won’t be like this [I’m sure hardly anyone can be found in this class ;)] should read this book.