Reply To: Result z-index / input space

Ernest Marcinko
Ernest Marcinko


Placing the search inside a slider might delay/ignore some javascript events like the window load and window resize event. The input field width is connected to an initial window resize event, however since the search bar is inside a slider, this event never reaches the search, most likely because it’s propagation is cancelled by the slider plugin.

The best solution in this case is to enforce a minimum width for the input field with a few lines of CSS:

.proinput input {
   min-width: 1000px;

The second issue is not related to the z-index itself. The slider “canvas” has a relative position, so everything inside of it is bounded by it’s borders. Thus doesn’t matter how you change the z-index, every element will stay inside the slide.
The search by default tries to prevent this by placing the result’s div at the bottom of the body element (moving it outside the slide), but only if the results position is set as hovering:
Try to set the results layout position to hovering, it should help.

If not, then we will proceed to another, more complicated solution.

Ernest Marcinko

If you like my products, don't forget to rate them on codecanyon :)