PDA

View Full Version : DHTML Window widget (v1.02)



JeanNg
05-02-2007, 08:18 PM
1) Script Title: DHTML Window widget (v1.02)

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...ndow/index.htm

3) Describe problem: css attributes and properties, such as

background-image {url('blablabla.gif');
filter: 'progid:DXImageTransform.Microsoft.Gradient(...)';
image links rollover

seem not to transfer along with the div into the widget window.

Is this just a limitation of the widget, or am I missing something (the css attached to the div works properly on the page calling the widget.

Thanks
JeanNg

mburt
05-02-2007, 08:34 PM
Your css properties are really messed up :). Try this:


.rollover {
background-image: url('blablabla.gif');
filter: progidXImageTransform.Microsoft.Gradient(...);
}

The .rollover is the class which the element should be applied to.

JeanNg
05-02-2007, 09:44 PM
Thank you very much for your feedback.

Have you been able to use image links hover, background-image, and filter properties in connection with the div option of the Window widget?

These properties seem to stop working once the div is tranferred into the Widget window. It appears that they are not carried over with the div into the window.

This is not an issue with the iframe option. But I need to use the div option for this project.

Thanks
Jean

ddadmin
05-03-2007, 05:20 AM
With the "div" mode" of loading content into the DHTML window, the script uses the .innerHTML property to transfer the content from the DIV to the window. So if there is an issue with filters not showing up afterwards, this is simply a limitation in IE filters when it's transferred using .innerHTML. I wouldn't say I'm surprised either.

The only possible solution I can think of if you must use the "div" option is to try and add the filter declarations directly inside the CSS of the DHTML window:


.drag-contentarea{ /*CSS for Content Display Area div*/
border-top: 1px solid brown;
background-color: white;
color: black;
height: 150px;
padding: 2px;
overflow: auto;
background-image {url('blablabla.gif');
filter: 'progid:DXImageTransform.Microsoft.Gradient(...)';
}

Worth a shot, though if that doesn't work, "iframe" may be your only option.

BTW, please use the CODE tag to format your code in your posts, and check the "disable smilies" checkbox when posting to prevent certain characters within your code from being treated as smilies instead.