This is a sample code to demonstrate
Responsive behaviour at breakpoints Auto Suggest State finder using jquery autocomplete Custom popup CSS3 animations with jquery Grid layout
Please open sample.html which is in code folder in a browser.
Functionalities:
- When click on Product title or the product image, details of the product will be displayed.
- User can click on the x button to close the product details section.
- When a number or feature is hovered, the same indicator in the image is also hovered.
- Similarly, if the number in image is hovered, the same number in the feature list is hovered.
- When user choose to filter product by prices, only products have price in the filtered price range are displayed.
- The State Finder drop-down - When user start typing some character in the textbox, the suggestions states are displayed. Those are states contains the searched word in their name. Eg: For example, if user type 'ca', California, North Carolina, South Carolina are shown.
- When user clicks on a stage, the popup will show. This screenshot shows sample when user click on North Carolina.
- The page is responsive and the breakpoints used are 1000, 720 and 360 which is for desktop, landscape and potrait mode respectively. (resize your browser)