1

I'm using the SmartyStreets jQuery plugin (which is awesome) on a PHP page. Also on that page is a thing where I need a jquery modal popup form.

However, the SmartyStreets "verify" button (which is automatically bound to my "zipcode" field on my HTML form) is stubbornly staying in front of my popup.

Any ideas how to fix that? I've tried: - $(myPopup).dialog("moveToTop"); - $(myPopup).zIndex(10000); - $("span.smarty-ui").hide();

None of those things have worked. Any ideas would be great.

Thanks! kevin

Matt
  • 22,721
  • 17
  • 71
  • 112
  • 1
    Are you sure it's not simpler than that? In your CSS, try: `.smarty-tag { z-index: 1 !important; }` maybe? You could tweak the z-index value to whatever you need. – Matt Aug 21 '13 at 21:25

1 Answers1

0

The SmartyStreets plugin sets the parent .smarty-ui class to an elevated z-index of 99999. You can easily reset this:

https://github.com/smartystreets/jquery.liveaddress/issues/13

I don't use Bootstrap and used the following CSS to override the default rule.

.smarty-ui {z-index:inherit !important;}

I also wanted to move the "verify" button to the left and added this rule:

a.smarty-tag {margin-left:10px;}
James Moberg
  • 4,360
  • 1
  • 22
  • 21