Artisteer CSS Menu Hidden by Java Applet? A problem? |
|
George Julius
|
I am very much interested in using Artisteer as a tool to quickly work up some website templates. I am evaluating the demo version and so far I am pretty impressed with what I see.
The only problem that I foresee is that I would like to embed a java applet for a virtual tour. I was told by a friend who has some passing experience with Artisteer that, since I want a relatively large virtual tour embedded in a Joomla article, I might have issues with the drop down menus being hidden by the Java applet.
I have experienced this with a few plug-ins and Joomla templates in the past, so I understand what my friend is saying. I guess it has to do with CSS drop downs and how Java applets are handled. By searching the forums, I understand that some people have had such an issue with Flash objects and I understand the solution for Flash.
Searching on-line for such a similar problem (Java applet obscuring a CSS drop down menu) I am unable to find a solution.
If anyone has any suggestions or has attempted this before, I would appreciate some insight. At this point I have a project on my plate that I have in mind for Artisteer, I just need to know how I might deal with this problem.
George
|
| |
Ian Shere
|
Hi George
It will be an issue with Z heights I'm guessing. If you get a conflict, add a z height. I rarely have the search module in the body of my page, preferring to have it on the menu bar or in the header. So, this is the CSS I use to make a new module position for it, complete with a z height to make sure it's not obscured.
div.module_search
{
position: absolute;
top: 10px; /* position */
left: 400px; /*position*/
z-index: 2;
}
You can make z-index as big as you like up to 9999 I think.
|
| |
David Johnson
|
Echo Ian's suggestion. But z-index can be tricky. There may be a few places where z-index decoration is required.
Best to work the issue with a development tool like FF plugin Firebug and/or use IE8 developers tool. Then you can make local changes within your browser environment to see what z-decorations may be required.
|
| |
George Julius
|
I appreciate the responses and help.
I had come across z-indexes when I looked into the whole Java applet/CSS menu thing as this had been suggested elsewhere on the web in similar situations.
http://www.ukbusinessforums.co.uk/forums/archive/index.php/t-93148.html
and elsewhere...
However this article seems to indicate it is not so simple as this:
http://www.oratransplant.nl/2007/10/26/using-iframe-shim-to-partly-cover-a-java-applet/
I guess I am missing something with regards to my CSS and web development skills, but I am trying to catch up.
For those with more knowledge, I was hoping that someone might have a suggestion as to what I would target on the Artisteer template CSS end for the standard top drop down menus. Which entries I might want to add higher Z-index values to.
Again, I have had a similar problems in the past when I was messing around with Joomla and other templates and plug-ins. I guess while I still am using the trial I will see how much I can play around with it. But this is going to be something that I will need to find a solution for. I just figured that someone else might have attempted this before.
Thanks,
George
|
| |
Shakir
|
Hi guys. There is a very simple fix for this problem.
I dont think its actually artisteers fault.
All you need to do is add a couple of lines to your flash embed code and hey presto, your drop down menus will appear over the top and no longer hidden behind.
For example, my embed code was saved a s a custom module and the dropdown was hidden behind until I added the 2 highlighted lines. Now all perfect! :)
add the line: <param name="wmode" value="transparent" />
and also add: wmode="transparent"
so your new embed code looks like this...
<p style="text-align: center;">
<object codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,32,18" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" type="application/x-shockwave-flash" height="672" width="896">
<param name="wmode" value="transparent" />
<param name="quality" value="high" />
<param name="src" value="flash/Movie1.swf" /><embed height="672" width="896" wmode="transparent" src="flash/Movie1.swf" quality="high" type="application/x-shockwave-flash"></embed>
</object>
</p>
I hope this helps someone :)
Regards
Shakir
Delicious Design
www.deliciousdesign.com.au
Vacation Rental Web Design
|
| |
|
|