|
1 | | -# jQuery datepicker |
2 | | -This is the repository for **jQuery datepicker**. For this repository we need three different jQuery files. |
3 | | -1. [jQuery.js](https://code.jquery.com/jquery-2.2.4.js) |
4 | | -2. [jQuery.ui.css](https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css) |
5 | | -3. [jQuery.ui.js](https://code.jquery.com/ui/1.12.1/jquery-ui.js) |
6 | | ---- |
7 | | -This repository contains the **jQuery** _function_ for change the _year_, _month_, _date format_ and _the first day of the week_, which in this case is set to Monday. |
8 | | -Also, after selecting a date, the selection of previous dates is disabled. |
9 | | -## |
10 | | -[PREVIEW](https://full-stack-web-developer-and-designer.github.io/jQuery-datepicker/) |
| 1 | +# jQuery Datepicker |
| 2 | +A lightweight, clean, and fully responsive **jQuery Datepicker** implementation designed for easy integration into any web project. |
| 3 | + |
| 4 | +--- |
| 5 | + |
| 6 | +## 📌 About the Project |
| 7 | + |
| 8 | +This project showcases a simple and user-friendly **jQuery UI Datepicker** with custom styling for modern websites and applications. |
| 9 | +It demonstrates how to quickly add an interactive calendar input to forms, landing pages, or booking systems. |
| 10 | + |
| 11 | +--- |
| 12 | + |
| 13 | +## ✨ Features |
| 14 | + |
| 15 | +- Fully functional **jQuery UI datepicker** |
| 16 | +- Responsive and mobile-friendly design |
| 17 | +- Custom styling for a clean, modern look |
| 18 | +- Easy to embed in any HTML page |
| 19 | +- Supports date selection with visual calendar UI |
| 20 | +- Simple, minimal code structure |
| 21 | + |
| 22 | +--- |
| 23 | + |
| 24 | +## 🛠️ Built With |
| 25 | + |
| 26 | +- **HTML5** |
| 27 | +- **CSS3** |
| 28 | +- **JavaScript** |
| 29 | +- **jQuery** |
| 30 | +- **jQuery UI** |
| 31 | + |
| 32 | +--- |
| 33 | + |
| 34 | +## 🚀 Live Demo |
| 35 | + |
| 36 | +Visit the working version here: |
| 37 | + |
| 38 | +👉 https://full-stack-web-developer-and-designer.github.io/jQuery-datepicker/ |
| 39 | + |
| 40 | +--- |
| 41 | + |
| 42 | +### 📷 Screenshot |
| 43 | + |
| 44 | +[](https://full-stack-web-developer-and-designer.github.io/jQuery-datepicker) |
| 45 | + |
| 46 | +--- |
| 47 | +## 📂 Project Structure |
| 48 | + |
| 49 | +```graphql |
| 50 | +jQuery-datepicker/ |
| 51 | +│── index.html # Main page containing jQuery datepicker |
| 52 | +│── LICENSE # MIT LICENSE |
| 53 | +└── README.md # This documentation file |
| 54 | +└── screenshot.png # screenshot |
| 55 | +``` |
| 56 | + |
| 57 | +--- |
| 58 | + |
| 59 | + |
| 60 | +--- |
| 61 | + |
| 62 | +## 🔧 Getting Started |
| 63 | + |
| 64 | +### 1. Clone the repository |
| 65 | + |
| 66 | +```bash |
| 67 | +git clone https://github.com/full-stack-web-developer-and-designer/jQuery-datepicker.git |
| 68 | +``` |
| 69 | + |
| 70 | +### 2. Open the project |
| 71 | + |
| 72 | +Simply open the index.html file in your browser. |
| 73 | + |
| 74 | +--- |
| 75 | + |
| 76 | +## 📦 How to Use |
| 77 | + |
| 78 | +To add this datepicker to your own project: |
| 79 | + |
| 80 | +1. Include jQuery |
| 81 | + |
| 82 | +2. Include jQuery UI |
| 83 | + |
| 84 | +3. Initialize the datepicker: |
| 85 | + |
| 86 | +```javascript |
| 87 | +$(function() { |
| 88 | + $("#datepicker").datepicker(); |
| 89 | +}); |
| 90 | +``` |
| 91 | + |
| 92 | +Place an input field with the matching ID: |
| 93 | + |
| 94 | +```html |
| 95 | +<input type="text" id="datepicker" placeholder="Select a date"> |
| 96 | +``` |
| 97 | + |
| 98 | +That's it! |
| 99 | + |
| 100 | +--- |
| 101 | + |
| 102 | +## 🤝 Contributing |
| 103 | + |
| 104 | +Contributions are welcome! |
| 105 | + |
| 106 | +1. Fork the repository |
| 107 | + |
| 108 | +2. Create a new branch |
| 109 | + |
| 110 | +3. Commit your changes |
| 111 | + |
| 112 | +4. Submit a pull request |
| 113 | + |
| 114 | +--- |
| 115 | + |
| 116 | +## 📄 License |
| 117 | + |
| 118 | +This project is released under the MIT License. |
| 119 | + |
| 120 | +-- |
| 121 | + |
| 122 | +### 👤 Author |
| 123 | + |
| 124 | +#### Mirnes Glamočić |
| 125 | +🌐 https://mirnesglamocic.com |
| 126 | + |
| 127 | +📧 Contact available on the website |
| 128 | + |
| 129 | +--- |
| 130 | + |
| 131 | +### ⭐ Acknowledgments |
| 132 | + |
| 133 | +Thank you for trying jQuery Datepicker! |
| 134 | + |
| 135 | +Feel free to send suggestions or improvements. |
| 136 | + |
| 137 | +--- |
| 138 | + |
| 139 | +### ⭐ If you find this project helpful, please give it a star! |
0 commit comments