In one of our recent projects we had to show a slider for a price range. The slider was to be used to show all products with prices between a minimum and a maximum. If we set filters in they will be shown as text boxes. For our project the client requirement was to show a slider above these text-boxes. See the screenshot. The JQuery UI has a good slider widget which will gives the graphical version of these range. We can use this widget with our views 'in between' clause.
Colorbox can be used to display content pop-ups. By default, the popup's height and width will be exactly the same as that of the original content. But there may be times, when you want to load the content as per the screen height. This can be done easily using jQuery.
The steps you may follow to achieve this are:
A large number of websites on the web today have some kind of slideshow in them and they are probably using a library like jQuery to create the slide effect. When there are 10 images cycling in a slideshow, you might want to shuffle the order of the slideshow a bit. If you have a slideshow in your Drupal website and want to know how to change the order of the slideshow on every pageload then continue reading to know more.
It is easy to show an image pop-up in Colorbox using Views in a Drupal website. You just have to change the image formatter in Views. However if you don't have a View and you still want to load the image in Colorbox, you can do it using jQuery. Read on to know how to load an image in Colorbox using jQuery in a Drupal 7 website.
Enabling the jQuery effects on a page is now no more a mess. Using a plugin called Adipoli, it is as simple as this to show different effects for our content:
- Add the necessary js files and css files.
- Select the element on which the effect is to be applied.
- Invoke the tooltip plugin.
So here is the code:
We were trying to create a new theme for our Drupal site and we came across an issue. How to create div "left" to be the same height as div "right" which can be smaller or bigger?
Is it possible to have the "left" div height adjusts automatically according to the "right" div height?
Here is what saved us: