• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar
  • Skip to footer
WittySparks Logo White

WittySparks

Ignite Your Thoughts

  • Topics
  • Reviews
  • Newsletter
WittySparks / Technology / Programming / Build your own Firefox like Multi Search Box for your site
Multi Search Form with custom Drop Down

Build your own Firefox like Multi Search Box for your site

Programming November 1, 2009 by Sravan K

As you all might have already observed our site WittySparks is growing with many quality services like BLOGs, NEWs, ViDEOs, TOPiCs, QUOTEs, GAMEs, and more to come soon. So thought to have a simple and user-friendly Global Search Form to search all my services provided with customized service-based drop-down options.

As usual, as everyone does – I started searching in Google for some cool, simple, and easy-to-use search form with multiple types of the search box to customize for my site. There are many scripts available on the net but couldn’t get one that is up to my expectations and my site requirements.

These are the things that are in my mind while searching for Multi-Search Form with Drop Down Options:

1. Should not be more complicated and should be easy to use
2. Should not have more JavaScript or CSS or HTML Code
3. Should be simple to tweak according to our site requirements
4. Among all, it should look Simple and Clean – yeh GUI and UI matters :)

But somehow couldn’t get the right script, so I love to work on some small snippets which make a big difference in terms of site performance or look and feel (GUI and UI) etc. I just had some small concepts in my mind on how we can easily build Multi-Search Form with custom Drop Down form Options with simple CSS, JavaScript, and HTML coding.

As you are all aware of my recent post – “Build Multi-level Multi-column Multi Menus with pure CSS” which is a simple menu without any JavaScript and works well with all the major browsers including Internet Explorer 6. I just took the above menu concept to build the Custom Drop Down menu for my new Multi-Search Box and with a little bit of JavaScript, I have to build Multi-Search Box which looks similar to Firefox Quick Search.

I named it “Multi-Search with custom Drop Down“.

and yeh works well with all the new and major browsers like Internet Explorer, Mozilla Firefox, Opera, Apple Safari and Google Chrome and one more great thing is it works well with Internet Explorer 6 too, as you all aware still we have many IE 6 users, it made me work for old browser too.

Check the Demo, Download and Explore yourself :) – feel free to enhance the same and let me know if you find any bugs.

demo download

And this gonna be a part of our WittySparks CSS Framework

Finally, don’t forget to spread it :)

Related Topics

  • PHP: Is it the best Programming Language ever?
  • How To Build A Great Search Box On Your Website
  • How to make Python3 version default in Windows OS?
Previous Post: « Internal Server Error in WordPress Blog with WP Super Cache
Next Post: 2 States by Chetan Bhagat »
Profile picture for Sravan K

About Sravan K

Contributor at WittySparks
WittySparks Staff

Sravan is a highly experienced web designer, user experience designer and developer. You can connect with him on Twitter or LinkedIn and initiate a chat.

View all posts by Sravan K

Primary Sidebar

Search

Exclusive Coupons

  • Moqups coupon code: WITTYSPARKS for 20% or PARTNERS50 for 50% discount.
  • WPForms coupon code: WITTYSPARKS for 50% off.
  • Serpstat coupon code: wittysparks_discount for 30% off.
  • SEO Buddy coupon code: WITTYSPARKS for 25% off.
  • Morningscore coupon code: wittysparks for 30% off for 3 months.
  • FlexClip coupon code: WITTYSPARKS for 30% off.
  • Uplead coupon code: “witty” for 30-day free trial.
  • FastestVPN coupon codes: WITTYSPARKS15 or WITTYSPARKS10 or Get up to 93% OFF.
  • Outranking.io coupon code: WITTYSPARKS50 for 50% off.

For more such offers visit our exclusive offers for SEO, Bloggers, Marketers and for Business owners.

Featured Productivity Software

Notion logo
Notion

Whether you’re a solo entrepreneur or a large team, Notion Workspace can help you stay organized and get more done. Get started today and take your productivity to the next level.

Try Notion for FREE

Footer

Affiliate Disclosure

If you make a purchase from WittySparks links, we will receive a small commission. See our Affiliate Disclosure.

Sponsors

Partnered with FreePik to use the licensed images.

turn to dhgate for smartphone

Follow Us

  • Facebook
  • Twitter
  • Pinterest
  • LinkedIn
  • Instagram
  • YouTube
  • RSS

Copyright © 2023 · Hosting sponsored by Rocket.net (Affiliate link)

  • About Us
  • Contact Us
  • Privacy Policy
  • LinkedIn
  • Twitter
  • Like
  • Pinterest