background preloader


Facebook Twitter

Best jQuery Slider Pulse Blinds Demo. Basic Linear Animation & Crystal Style Best jquery slider This Crystal slider demo has depth, style and texture - making it perfect for sophisticated websites with elegant themes.

Best jQuery Slider Pulse Blinds Demo

The slider uses a semi-transparent black frame that gives the images within a subtle weight. There is a shadow effect around the jQuery slider, which helps lift it off the page and attract attention. The combination of the dark frame and shadow gives the slider as a whole a subtle elegance, it draws attention without bright colors or hard edges. You can navigate through the slider in two ways. The slider is responsive, and interestingly, on smaller screens, the next/previous arrows disappear, creating more room for the images and allowing them to have maximum impact. You can navigate through the slideshow in two ways. The second way you can navigate is via the use of dots below the slider. There is a caption in the lower left corner of each slide. Table Drag and Drop JQuery plugin. Why have another plugin?

Table Drag and Drop JQuery plugin

Dragging and dropping rows within a table can’t be handled by general purpose drag and drop utilities for a number of reasons, not least because you need to move the whole row, not just the cell that receives the mouse events. Re-parenting the row also requires specific code. Sadly also, effects like fadeIn and fadeOut don’t work well with table rows on all browsers, so we have to go for simpler effects. What does it do? This TableDnD plugin allows the user to reorder rows within a table, for example if they represent an ordered list (tasks by priority for example).

How do I use it? Download Download jQuery (version 1.2 or above), then the TableDnD plugin (current version 0.7).Reference both scripts in your HTML page in the normal way.In true jQuery style, the typical way to initialise the tabes is in the $(document).ready function. The HTML for the table is very straight forward (no Javascript, pure HTML): onDragStyle onDropStyle onDragClass onDrop onDragStart. jQuery’s Data Method – How and Why to Use It.

Martin Angelov jQuery’s data method gives us the ability to associate arbitrary data with DOM nodes and JavaScript objects.

jQuery’s Data Method – How and Why to Use It

This makes our code more concise and clean. As of jQuery 1.4.3 we also have the ability to use the method on regular JavaScript objects and listen for changes, which opens the doors to some quite interesting applications. The Basics You can call the data method on a jQuery object, or you can use the $.data() function instead. $("#myDiv").data("key","arbitrary value"); $.data($("#myDiv").get(0),"key","arbitrary value"); The data function is a low level implementation, and is actually being used by the method call behind the scenes. Also, notice that you need to pass a DOM element as the first parameter of $.data, and not a jQuery object.

When you use the data method, you need to pass two parameters – a key and a value to be stored. Now that you’ve inserted your data, you can read it by calling the data method with a single parameter – the key: Behind the Scenes Learn more. Form Design with Sliding Labels « CSSKarma. A few weeks ago I was reading an article on form UI by Luke Wroblewski of Yahoo!. For those who aren’t familiar with Luke, he (quite literally) wrote the book on good form design. In the article, one certain section about placing labels inside of form fields stood out to me: Because labels within fields need to go away when people are entering their answer into an input field, the context for the answer is gone.

So if you suddenly forget what question you’re answering, tough luck—the label is nowhere to be found. As such, labels within inputs aren’t a good solution for long or even medium-length forms. He brings up a good point. For best practice, Luke talks about leaving your labels outside the form field so it’s always available to the user. Enter: Sliding Labels After reading that article it occurred to me that there’s no reason we can’t have the best of both worlds.

View demo The HTML At this point we have a pretty basic, and ugly form.