asked on

Jquery hover modal popup

Does anyone know of a jquery modal popup that would work when the cusor hovers over the link and then disappears when the cusor is moved off the modal popup. If you click on the link it will take the user to a new page, but I want the modal popup to display when hovering over the link that will display a subset of the data that is available when you click on the link and are redirected to the new page.

Here is my a href tag...

<a href="/00U/c?cType=2&md0=2011&md3={!day.dayOfYear}&dtfd={!MONTH(day.date)}/{!DAY(day.date)}/{!YEAR(day.date)}" title="Day View - {!day.date}">{!day.dayofmonth}</a>

Open in new window

Roman Gherman

Hi,

You could use jQuery position: http://docs.jquery.com/UI/Position

When hovering set the position, when mouse is out of the popup - hide it.

You can also take a look at this post - it is doing the same thing with the menu:
http://extremedev.blogspot.com/2011/02/menu-on-multiple-lines.html

-Dman100-

ASKER

I took a look at the UIPosition, but I was trying the demo and it wasn't working. Am I missing something?

What should be happening with the UIPosition plugin?

Roman Gherman

the ui position will help you to set the position of your modal popup right where you need near the a href tag.

-Dman100-

ASKER

Hi Roma,

My apologies...I probably didn't correctly explain what Iwanted in my post. The position isn't the issue. I'm okay if the position is centered or really anywhere on the page. What I need is a plugin that will display a modal popup when I hover over the link and disappear when I move the cursor off the modal popup dialog.

Does that make any sense?

My apologies for any confusion.

Thanks for your help. I sincerely appreciate it.
Regards.

ASKER CERTIFIED SOLUTION

Roman Gherman

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

-Dman100-

ASKER

Hi Roma1123,

Thank you for your help. It is working now. I had one additional follow-up question. When I ran the test page, I got a message "Allow Blocked Content" and when I put the code into our Salesforce environment, I get the message "Do you want to view only the webpage content that was delivered securely"

If I allow the blocked content it works as expected and if I choose "No" for the secure content, it works fine.

Is there a way to get rid of that message? Is it because I'm linking to an external site to access the jquery script files?

Do I need to download those files and access them directly instead of over the internet?

Thanks again for your help!
Regards.

Roman Gherman

Hi,

The "Allow Blocked Content" will be displayed only when you open the HTML locally.
What about SalesForce - try to copy jquery in the project rather than linking to an external source.

Sorry, but I'm not too common with Salesforce.