Display problem with AjaxSearch snippet

30 Posts

slinouille Reply #1, 20 years ago

Hello,

I’m trying to use AjaxSearch on my website but I’m struggeling with a strange behavior of the results.
Indeed, the results are not clickable and not really readable, as if the background of the block was transparent.
See the next screen capture, it will be more understandable wink

I’ve tried to modify the css but without any results ... do you have an idea of what could get that wrong?

Thank you for any idea rolleyes

4,213 Posts

doze Reply #2, 20 years ago

Mollio template uses alot of z-index in different elements.. and they are set to 9999.. so set the ajax search result div above that or remove the z-indexes from mollio template.

"He can have a lollipop any time he wants to. That's what it means to be a programmer."

30 Posts

slinouille Reply #3, 20 years ago

Thank you Doze for your answer ... but I’ve already suppressed all "z-index" from css file.

huh

I’ve also tried with z-index=0, =1000, ... and many other values but without any success.

ANy other idea ?

Thanks

☆ A M B ☆
24,524 Posts

sottwell Reply #4, 20 years ago

Set the background of the search results container to #ffffff. It may have to be done in the javascript itself.

Studying MODX in the desert - http://sottwell.com
Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
Join the Slack Community - http://modx.org

30 Posts

slinouille Reply #5, 20 years ago

Hello

I’ve also tried that ... here is exactly the AS part in the CSS file:

#ajaxSearch_form {
            color: #444;
            width: auto;
        }
        .ajaxSearch_paging {
    
        }
        .AS_ajax_result {
            color: #444;
            margin-bottom: 3px;
			background: #FFFFFF;
        }
        .AS_ajax_resultLink {
            text-decoration: underline;
        }
        .AS_ajax_resultDescription{
            color: #555;
        }
        .AS_ajax_more {
            color: #555;
        }

Can you see something wrong?

Thanks

☆ A M B ☆
24,524 Posts

sottwell Reply #6, 20 years ago

I suspect that somewhere in your CSS you have something set with "background:transparent" that is overriding the class style background.

Studying MODX in the desert - http://sottwell.com
Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
Join the Slack Community - http://modx.org

30 Posts

slinouille Reply #7, 20 years ago

Well well ... i become upset huh

I’ve suppressed all "transparent" and always the same behavior undecided

There must be something somewhere ... 3 hours at least I’m on this problem :’(

4,213 Posts

doze Reply #8, 20 years ago

And you are sure that you modified right files and they are not coming from cache?

"He can have a lollipop any time he wants to. That's what it means to be a programmer."

30 Posts

slinouille Reply #9, 20 years ago

Absolutely !

Do you think it can come from module "quickedit" that uses a large number of z-index ?

huh

228 Posts

identity Reply #10, 20 years ago

Is there a URL you can provide?

Based on what you are saying... not clickable, not readable because of other text, this sounds like a clear case of an issue with z-index.

View with FF with the Web Developer Extension, then turn on Typographic within Information. You should see whether any boxes are over the top.

If you haven’t, try putting your search form in a div, set the CSS on that div to position: relative; and give it a z-index: 10000, set background: #FFF, and declare a width on the div... perhaps adding !important to all of these. Likewise, try adding similar to some of the specific Ajax CSS.

I know I went round and round a bit with this one and sometimes you just have to go over it all again from scratch.

good luck

| Identity Developments delivers SEO focused web design and web presence services
- it's not about websites, it's about your identity. |