Atif's public fiddles
-
H372y
jQuery 1.4.4, HTML, CSS, JavaScript
-
7eDts
jQuery 1.4.4, HTML, CSS, JavaScript
-
xV35R
jQuery 1.7.1, HTML, CSS, JavaScript
-
simple video player with custom controls using html5 video and input[type=range] element
jQuery 1.9.1, HTML, CSS, JavaScript
-
Simple image slider
jQuery (edge), HTML, CSS, JavaScript
-
AnythingSlider playground
Add, remove, adjust any or all options so you can see how it works.
-
flipsdye
jQuery 1.9.1, HTML, CSS, JavaScript
-
C6uB5
jQuery 1.9.1, HTML, CSS, JavaScript
-
8enFK
jQuery 1.6.4, HTML, CSS, JavaScript
-
Sliding Buttons, Right to Left
jQuery 1.8.3, HTML, CSS, JavaScript
-
Pure CSS tooltip - with CSS3 animation
Mootools 1.4.2, HTML, CSS, JavaScript
-
Remove this (anchor tag)
All Javascript
-
r8czf
jQuery 1.8.3, HTML, CSS, JavaScript
-
4DD9z
jQuery 1.7.1, HTML, CSS, JavaScript
-
CSS Slider Menu
Objective: To create a CSS-only layout including a scrollable menu that slides out from the left. Meant for mobile versions of sites. Live Demo: https://github.com/NicholasRBowers/CSS-Menu-Slider Additional Information: -CSS-only -Meant for mobile devices -Meant to be used in conjunction with Responsive Design -Want to design as semantic as possible -Akin to Facebook's Mobile and App layout -Completely breaks in IE -Collaboration welcome! Operation Logic: -Uses the checkbox-hack to store state information (http://css-tricks.com/the-checkbox-hack/) =When unchecked, menu is closed, when checked menu is open. -Input checkbox exists at the base level of the HTML (under <body>) with an absolutely positioned <div> tag afterwards that encapsulates the page. -<div> tag holds the rest of the page, including fixed absolutely positioned elements. -Header and Navigation toggle are fixed at top, scrollable <div> under, and fixed/scrollable menu to the left. -An extra invisible label allows a click anywhere on the right to toggle states and collapse the menu. Comments: -Completely broken in IE, but as this is meant for mobile only, I'm not sure that's a problem. -Zooming out on a mobile device sometimes causes rendering problems. -Had to put the rest of the page in a <div> that was a sibling to the <input> element, because the default Android browser only supports the adjacent sibling combinator (+) when used in tandem with a pseudo-class (:checked). NOTE: It does support the sibling combinator (~), but it only picks up the adjacent element. Twitter: @NicholasRBowers
-
Kdqt6
jQuery 1.6.2, HTML, CSS, JavaScript
-
same page transitions
No-Library (pure JS), HTML, CSS, JavaScript
-
TadN2
jQuery 1.6.2, HTML, CSS, JavaScript
-
f9D8Y
jQuery 1.7.1, HTML, CSS, JavaScript
-
wAJRe
jQuery (edge), HTML, CSS, JavaScript