jquery ui Archives - Page 2 of 2

How to Highlight Selected date in jQuery UI Datepicker

Last updated on November 15, 2022 by Yogesh Singh

jQuery UI library has many widgets for specific purposes like – Accordion, Tabs, Tooltip, etc. one of them is Datepicker which allows the users to pick a date from the Widget.

It has various options to manage the Datepicker layout e.g. change the default date format, restricting date range, show year dropdown, etc.

While using this Widget you may have a condition arises where you want to highlight some of the specific dates or change the background-color of Holidays, events Days.

You can do this with beforeShowDay option in the datepicker() method. This allows you to specify a CSS class that contains your defined CSS style.

How to Shake an element with jQuery UI

Last updated on February 19, 2023 by Yogesh Singh

In WordPress Admin dashboard login form animate with a shake effect whenever the user enters the wrong details.

This can easily implement using the jQuery UI library.

With jQuery UI you can shake an element in a specific direction and distance.

Using this you can warn the user when invalid input is entered.

In the demonstration, I am creating a login form and which gets shake when the wrong username and password entered.

Dynamically show data in jQuery UI Tooltip using PHP

Last updated on May 27, 2023 by Yogesh Singh

In the constantly evolving world of web development, creating an immersive and engaging user experience is crucial. One way to achieve this is by utilizing tooltips – a powerful tool that provides additional context and information when users interact with specific elements on a website.

By combining jQuery UI Tooltip with PHP, you can create dynamic tooltips that seamlessly fetch and display data in real-time.

In this article, readers will embark on a journey to explore the fusion of these technologies, discovering how interactive tooltips can captivate and inform users while showcasing data in creative ways. So why wait? Let’s dive into the exciting world of dynamically showcasing data in jQuery UI using PHP!

Easily add Tooltip to the Element using jQuery UI Plugin

Last updated on October 3, 2022 by Yogesh Singh

By adding a tooltip widget to the element you can show a short description or some additional information about the element e.g. – what it does, what values the users can input on it, etc.

It will show when the user moves the mouse pointer over the element.

In this tutorial, I am using jQuery UI to add a tooltip that can be attached to any HTML control like – label, input element, span, paragraph, etc.