Tab menu background problem

I am using the spry tabbed menu and currently I have the
background image of the entire header section set to a repeating
image. I left the tabbed menu div background color and image blank
so that the header section will come thru. It works fine in IE 7
but in FF the tabbed menu adds a white background... here is the
link to the test page...
http://afm.geofoam.com/homepage.asp
Any suggestions?

Hi,
Try to add a fixed height for the header container. I added
for this css rule: .thrColFixHdr #header the height:105px and seems
to work also in FF.
Please let us know if this fixes your problem
Diana

Similar Messages

Using LT for motion menu background – problems

I’m trying to use a LT texture (Canvas>Sinopia) as a motion menu background. I exported 30 secs of the rendered texture direct from LT. The QT file size is 1.09 GB. Couldn’t get it to work in DVDSP. Took that file into FCP and re-exported it using custom settings. File size now 108.7 MB. Still doesn’t work in DVDSP.
Should I be putting the 30 second file through Compressor? Is it the large file size that is causing the problems?
Importing the .lpr file into DVDSP also doesn’t work (although I prefer to pre-render all assets, otherwise DVDSP slows to a crawl).
I’ve now tried the texture as a 5 sec version (20 MB file) – works fine, but there’s an annoying jump in the loop every 5 secs. If I could fix that, the menu would probably be OK.
Any advice appreciated.
Regards. Robert.

Both solutions worked. Wish I could award 2 solved stars.
Compressor produced an m2v file of 21.9 MB. I'm going with that because the workflow is quicker and simpler on my old setup.
Exporting as DV from FCP produced a file size of 103.2 MB. My DVDSP slows down with large file sizes, so I'll give it a miss. Or could still be me doing something incorrectly.
I'm working in SD PAL 16:9.
Help was much appreciated.
Regards. Robert.

Spry vertical menu background problem in IE

The background of the <li> items show as white on the spry menu items here. http://www.steveelson.com/index.html. Menu items are .pngs, but I've used the iepngfix.htc fix, but still have the problem in IE 8 and 9. So I assume it's a css problem, but can't figure it out.

Save a copy of the css file as you have altered it, but under a new name. You might want to save a copy of your menu, too, so you'll have something to refer to. Then delete your menu widget and re-insert it.
You will most likely be very surprised at how easy it is to style it up (referring from time to time to your saved, former stylesheet).
If your page works without your menu, you should be successful inserting your menu to it.
Beth

Spry tab menu background image is not displaying on remote server

Hello All,
I have a problem with spry tab panel, it is not displaying image in the background when it is active, it is working properly in local server but when i upload to remote it vanishes.
Here is the link
http://www.geftas.com/temaritestpage/about.html
Also I am uploading Css and html code below
Any help would be exteremely appreciated.
Thanks
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf8"/>
<meta http-equiv="content-type" content="cache" />
<meta http-equiv="robots" content="INDEX,FOLLOW" />
<meta http-equiv="keywords" content="Enter Keywords"/>
<meta http-equiv="description" content="Description Here" />
<title>TEMARI&CO. | Business Strategists</title>
<link href="css/about.css" rel="stylesheet" type="text/css" media="screen" />
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="wrapper">
          <div id="header"></div>
<div id="navigation">
    <ul id="MenuBar1" class="MenuBarHorizontal">
      <li><a href="index.html">HOME</a></li>
      <li><a href="about.html" class="current">ABOUT</a></li>
      <li><a href="#" class="MenuBarItemSubmenu">CONSULTING</a>
        <ul>
          <li><a href="#">Business Plan</a></li>
          <li><a href="#">Marketing Plan</a></li>
          <li><a href="#">Incorporation</a></li>
          <li><a href="#">Accounting System</a></li>
        </ul>
      </li>
      <li><a href="#" class="MenuBarItemSubmenu">INDUSTRIES</a>
        <ul>
          <li><a href="#">Untitled Item</a></li>
          <li><a href="#">Untitled Item</a></li>
          <li><a href="#">Untitled Item</a></li>
          <li><a href="#">Untitled Item</a></li>
        </ul>
      </li>
      <li><a href="#">OUR PROCESS</a></li>
      <li><a href="#">CAREERS</a>      </li>
      <li><a href="#">CONTACT</a></li>
    </ul>
</div>
<div class="shadow" id="content">
<div id="TabbedPanels1" class="TabbedPanels">
    <ul class="TabbedPanelsTabGroup">
      <li class="TabbedPanelsTab" tabindex="0">values</li>
      <li class="TabbedPanelsTab" tabindex="0">people</li>
    </ul>
    <div class="TabbedPanelsContentGroup">
      <div class="TabbedPanelsContent">
                <div id="scrolltext">
                    <h1>Heading1</h1>
        <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. N</p>
        </div>
      </div>
      <div class="TabbedPanelsContent">
                  <div id="scrolltext">
                    <h1>Heading1</h1>
        <p>Lorem n, </p>
                            <h1>Heading1</h1>
        <p>Lorem ipsum dolor sit amet, , </p>
                           <h1>Heading1</h1>
        <p>Lorem ipsum dolor sit a, </p>
                           <h1>Heading1</h1>
        <p>Lorem ipsum dolor sit amet, </p>
        </div>
      </div>
    </div>
</div>
</div>
<div id="footer">
<div id="legal">
                      <ul>
                          <li>Copyright © 2012 Temari&Co</li>
                    <li>| Privacy Policy |</li>
                    <li>Terms of Use</li>
                </ul>
    </div>
            <div id="socialmedia">
                      <ul>
                          <li><img src="images/fbicongri.png" width="20" height="20" alt="fbicon" /></li>
                    <li><img src="images/gicongri.png" width="20"          height="20" alt="gicon"/></li>
                    <li><img src="images/linkedinicongri.png" width="20" height="20" alt="linkedin"/></li>
                    <li><img src="images/twittericongri.png" width="20" height="20" alt="twitter"/></li>
              </ul>
      </div>
</div>
</div>
<script type="text/javascript">
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
</script>
</body>
</html>
@charset "UTF-8";
/* SpryTabbedPanels.css - version 0.6 - Spry Pre-Release 1.6.1 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
/* Horizontal Tabbed Panels
* The default style for a TabbedPanels widget places all tab buttons
* (left aligned) above the content panel.
.TabbedPanels {
          overflow: hidden;
          margin: 0px;
          padding: 0px;
          clear: none;
          width: 100%;
          height:100%; /* IE Hack to force proper layout when preceded by a paragraph. (hasLayout Bug)*/
.TabbedPanelsTabGroup {
          margin: 0px;
          padding: 0px;
.TabbedPanelsTab {
          position: relative;
          float: left;
          background-color: #FFF;
          list-style: none;
          -moz-user-select: none;
          -khtml-user-select: none;
          cursor: pointer;
          font-family: Arial, Helvetica, sans-serif;
          font-size: 9pt;
          font-weight: normal;
          color: #666;
          height: 30px;
          width: 116px;
          text-transform: uppercase;
          text-align: center;
          line-height: 30px;
          margin: 0px;
          padding: 0px;
.TabbedPanelsTabHover {
          background-image: url(../../SUPEROLDU/images/menubaractive.png);
          background-repeat: repeat-x;
          color: #FFF;
.TabbedPanelsTabSelected {
          background-image: url(../../SUPEROLDU/images/menubaractive.png);
          background-repeat: repeat-x;
          color: #FFF;
          height: 30px;
          width: 116px;
.TabbedPanelsTab a {
          color: black;
          text-decoration: none;
.TabbedPanelsContentGroup {
          clear: both;
          background-color: #FFF;
          height: 100%;
          width: 824px;
          font-family: Arial, Helvetica, sans-serif;
          font-size: 9pt;
          color: #666;
          border-top-width: 1px;
          border-right-width: 1px;
          border-bottom-width: 1px;
          border-left-width: 1px;
          border-top-style: dotted;
          border-top-color: #CCC;
          border-right-color: #CCC;
          border-bottom-color: #CCC;
          border-left-color: #CCC;
.TabbedPanelsContent {
          height: 100%;
          width: 100%;
          overflow:hidden;
.TabbedPanelsContentVisible {
.VTabbedPanels {
          overflow: hidden;
          zoom: 1;
.VTabbedPanels .TabbedPanelsTabGroup {
          float: left;
          background-color: #EEE;
          position: relative;
.VTabbedPanels .TabbedPanelsTab {
          float: none;
          margin: 0px;
          border-top: none;
          border-left: none;
          border-right: none;
.VTabbedPanels .TabbedPanelsTabSelected {
          background-color: #EEE;
.VTabbedPanels .TabbedPanelsContentGroup {
          clear: none;
/* Styles for Printing */
@media print {
.TabbedPanels {
          overflow: visible !important;
.TabbedPanelsContentGroup {
          display: block !important;
          overflow: visible !important;
          height: auto !important;
          margin-top: 0px;
          margin-right: auto;
          margin-bottom: 0px;
          margin-left: auto;
.TabbedPanelsContent {
          clear:both !important;
          margin-top: 0px;
          margin-right: auto;
          margin-bottom: 0px;
          margin-left: auto;
          width: 744px;
.TabbedPanelsTab {
           overflow: visible !important;
           display: block !important;
           clear:both !important;

Assuming these are the images you're trying to display:
.TabbedPanelsTabHover {
          background-image: url(../../SUPEROLDU/images/menubaractive.png);
          background-repeat: repeat-x;
          color: #FFF;
.TabbedPanelsTabSelected {
          background-image: url(../../SUPEROLDU/images/menubaractive.png);
          background-repeat: repeat-x;
          color: #FFF;
          height: 30px;
          width: 116px;
You have 2 root paths in your URL code. I think this is how your file structure looks like on your local computer. However, on a remote server, ../ by itself means you're pointing to the root folder of your website. Your URL linkage should be corrected based on the relativity and your background will work without a problem.

Menu Background Problem

I'm using a Quicktime video as the Background to my iDVD menu. It looks great in the Preview, but when I burn to the disk, it results in a badly digitized image.
What's the problem? The Quicktime file is 720x480 so it shoud be full TV resolution.
How do I ensure a 1:1 quality ratio from the preview to the finished disk?
My Encoder is set for "Best Quality" but it doesn't seem to make any difference.

I'm using a Quicktime video as the Background to
my
iDVD menu. It looks great in the Preview, but when
I
burn to the disk, it results in a badly digitized
image.
What's the problem? The Quicktime file is 720x480
so
it shoud be full TV resolution.
... but on the TV set, the image has been mpg-2
compressed and mpg-2 compression is NOT lossless!!!
What CODEC did you use when you made the Quicktime
background movie?
How do I ensure a 1:1 quality ratio from the
preview
to the finished disk?
You can't because of mpg-2 compression.
My Encoder is set for "Best Quality" but it
doesn't
seem to make any difference.
Actually, despite the names Apple has given the two
compression modes, for content under 60 minutes on a
single-layer disc, 'BEST PERFORMANCE' gives better
quality than the so called 'Best Quality' mode. Only
use 'Best Quality' when the length of your content
requires it.
F Shippey
I appreciate the response; I'm new to this whole thing. I'm not sure what the CODEC is, but I know when I watch the DVD, on TV or on a computer, the image is badly digitized.
How can I create a broadcast quality menu with iDVD? It works fine with a still image, but everytime I throw a clip in there, it's horrible. This is especially frustrating because the iDVD sample menus have movie clips in the background that look great before and after burning.

CS5 Encore Multi page menu background problem

I am trying to create a multi-page Blu-Ray so there is seamless background video playback while navigating to different pages. On one of the secondary pages, I am needing to cover up a portion of the BG video with a still and some buttons over the still. Encore seems to ignor anything but buttons for all sub pages..
I'm sure it's just an issue with my PSD layer structure/ naming, but I have no Idea.
Here is page 1, each tile is a looping video
This is what Page 2 should look like. All 3 tiles to the right are stills.
Here is a shot of my layers if that helps. The highlighted folder is what is being ignored..
I know with a single page menu, you can have it set up this way, with anything you want as a BG all just put into a folder.
With the way it's currently set up, when I build an iso, it ignors the stills on the right and shows the video with the buttons ontop of that.
I have also tried making the stills the actual buttons, but the loss of color quality and an issue where some pixels are rendered transparent makes that solution not work for my purposes.
Please help, thanks!

With that confirmation, I used the workaround of making the main menu button a title-sized heading at the top, then making its text vary (e.g. the Page 0 version was Main Menu from Page 0, from Page 1 "main menu from Page 1" etc). Since the main menu button has an opaque background, it appears to change the title for each page.
Edit: You cannot use this method for a background, since it creates overlapping buttons.

Safari setting on iPad "Open New Tabs in Background" is not working

A couple of weeks ago, I decided that I wanted to see the tab bar in Safari, on my iPad, just like on my MacBook.
So, I went to...
Settings >> Safari
...and I turned OFF the setting "Open New Tabs in Background".
Then, the tab bar appeared and every new page that I opened displayed across the tab bar in a new tab, just like I wanted.
Today, I devised that I liked the pages in the background a lot better and I changed the setting to ON.
PROBLEM: the Tab Bar remains, no matter how many pages are open.
What's worse is that, in the menu bar, next to the bookmark and box-arrow icon, the numbered icon is missing (the icon that displays the number of the pages that you have open).
How do I get that icon back and the Tab Bar to disappear?

Looks like some confusion here.
Safari on an iPad running iOS 6 as your signature implies does not open separate pages and the box with the number of open pages is not there. This was how Safari on an iPad worked in an earlier version of the iOS but safari presently only supports tabs.
When you select to turn on Open Pages in the Background, select a link and opening it in a new page will create a new tab and the link will load there BUT Safari on your iPad will remain on the original page. You'll need to tap the ba to see the new page. Turning off Open Pages in the Background will let Safari switch to the new tab immediately.
An iPhone, however, retains the old feature of separate windows and there is a box with a number at the bottom of the screen letting your know how many windows you have open.

Still image disappears from menu background on burning to DVD

I’ve just completed a project in Adobe Premiere Elements 9 in which I’ve personalized the menu background with a still image (trying two different disc menu templates - sport swimming and one under memories - can't remember the name of that one). With both these templates the still image shows up perfectly on my computer screen while I'm in the project but when I burn the project to DVD the still image doesn't appear on playback of the DVD. I have done other projects in PE9 with no problems with still images in existing disc menu templates - travel ship template and the template that comes as standard with PE9 before adding additional templates). I would prefer not to use either of these templates for my current project.
I see previous treads have commented on changing the size of the image...this doesn't seem to make a difference for me and the other suggestion is to somehow change the name of the file for the templates to get around this problem but i'm not understanding this. I still don't understand why some templates work and others don't. Does anyone have a simple to understand solution to this?
Or does anyone have a list of the disc menu templates that work with personalizing?
thanks heaps.

There does seem to be a bug that affects some menu templates.
Try the Generic template under the General tab.
There are also a number of menu templates available at Premiere Elements support site http://Muvipix.com that will work with no problem and can be easily customized.

Need help making javascript thumbnail gallery function in javascript tab menu

Hello all,
I have implemented a css/javascript tab menu on one of my html pages thanks to Chris Coyier (http://css-tricks.com/learning-jquery-fading-menu-replacing-content/), and within one of the tabs, which I labeled GALLERY, I am trying to place a thumbnail gallery curtosy of Trent (http://www.twospy.com/galleriffic/).
Before trying to place it in the menu, I made the gallery on a seperate html page to make sure that I could get it to work. It does. But when I place it in the menu it shows up on page load under the content of the first tab (labeled TOUR) and not in the gallery tab. In addition, once I click on the "gallery" tab the other tabs stop showing their content. I feel like I am missing something obvious. But I just can't figure out what. If anyone can help I would greatly appreciate it.
Thanks,
Natalie
Below is the code of my whole page:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Tour template</title>

<link rel="stylesheet" type="text/css" href="MenuFader/style.css">
<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
        $(function(){
            $("#tour-button").css({
                opacity: 0.3
            $("#gallery-button").css({
                opacity: 0.3
            $("#page-wrap div.button").click(function(){
                $clicked = $(this);
                // if the button is not already "transformed" AND is not animated
                if ($clicked.css("opacity") != "1" && $clicked.is(":not(animated)")) {
                    $clicked.animate({
                        opacity: 1,
                        borderWidth: 5
                    }, 600 );
                    // each button div MUST have a "xx-button" and the target div must have an id "xx"
                    var idToLoad = $clicked.attr("id").split('-');
                    //we search trough the content for the visible div and we fade it out
                    $("#contents").find("div:visible").fadeOut("fast", function(){
                        //once the fade out is completed, we start to fade in the right div
                        $(this).parent().find("#"+idToLoad[0]).fadeIn();
                //we reset the other buttons to default style
                $clicked.siblings(".button").animate({
                    opacity: 0.5,
                    borderWidth: 1
                }, 600 );
</script>

<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
<style type="text/css">

</style>

<title>Example tour page</title>
<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="Gallery/js/jquery.galleriffic.js"></script>
<script type="text/javascript" src="Gallery/js/jquery.opacityrollover.js"></script>
<script type="text/javascript">
            document.write('<style>.noscript { display: none; }</style>');
</script>
<link rel="stylesheet" type="text/css" href="Gallery/css/galleriffic-2.css">
<link rel="stylesheet" type="text/css" href="Gallery/css/basic.css">

</head>

<body>
<div id="realtor panel"><table width="100%" border="0">
<tr>
    <td width="18%"> <div align="center"></div></td>
    <td width="82%"> </td>
</tr>
</table>
</div>
<div id="page-wrap">
        <div id="tour-button" class="button">
            <img src="MenuFader/images/TOUR.png" alt="tour" class="button" />
        </div>
        <div id="gallery-button" class="button">
            <img src="MenuFader/images/GALLERY.png" alt="property gallery" class="button" />
        </div>
        <div id="info-button" class="button">
            <img src="MenuFader/images/INFO.png" alt="info" class="button" />
        </div>
        <div id="specs-button" class="button">
            <img src="MenuFader/images/SPECS.png" alt="specs" class="button" />
        </div>
        <div class="clear"></div>
<div id="contents">
    <div id="tour">
      <script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','wid th','1270','height','443','src','swf files/Tudor Arms interative floor plan','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movi e','swf files/Tudor Arms interative floor plan' ); //end AC code
</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="1270" height="443">
        <param name="movie" value="swf files/Tudor Arms interative floor plan.swf" />
        <param name="quality" value="high" />
        <embed src="swf files/Tudor Arms interative floor plan.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="1270" height="443"></embed>
      </object></noscript>
    </div>
    <div id="property gallery">
         <div id="container">
                <div id="gallery" class="content">
                    <div id="controls" class="controls"></div>
                    <div class="slideshow-container">
                        <div id="slideshow" class="slideshow"></div>
                    </div>
                </div>
                <div id="thumbs" class="navigation">
                    <ul class="thumbs noscript">
                        <li>
                            <a class="thumb" href="Gallery/images/example/apt entrance1.jpg">
                            <img src="Gallery/images/example/Tudor thumbs/apt face1.jpg" alt="apt entrance1" />
                            </a>
                       </li>
                      <li>
                            <a class="thumb" href="Gallery/images/example/apt entrance2.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/apt face2.jpg" alt="apt entrance2" />
                            </a>
                      </li>
                      <li>
                             <a class="thumb" href="Gallery/images/example/apt entrance3.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/apt face3.jpg" alt="apt entrance3" />
                          </a>
                      </li>
                        <li>
                             <a class="thumb" href="Gallery/images/example/apt sign.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/apt sign.jpg" alt="apt sign" />
                          </a>
                      </li>
                      <li>
                             <a class="thumb" href="Gallery/images/example/entryway1.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/entry.jpg" alt="entry" />
                          </a>
                      </li>
                        <li>
                             <a class="thumb" href="Gallery/images/example/living room1.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/living1.jpg" alt="living1" />
                          </a>
                      </li>
                       <li>
                             <a class="thumb" href="Gallery/images/example/living room2.jpg" >
                             <img src="Gallery/images/example/Tudor thumbs/living2.jpg" alt="living3" />
                          </a>
                      </li>
                        <li>
                             <a class="thumb" href="Gallery/images/example/living room3.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/living3.jpg" alt="living3" />
                          </a>
                      </li>
                      <li>
                             <a class="thumb" href="Gallery/images/example/dining1.jpg" >
                             <img src="Gallery/images/example/Tudor thumbs/dining1.jpg" alt="dining1" />
                          </a>
                      </li>
                        <li>
                             <a class="thumb" href="Gallery/images/example/Dining2.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/dining2.jpg" alt="dining2" />
                          </a>
                      </li>
                      <li>
                             <a class="thumb" href="Gallery/images/example/dining3.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/dining3.jpg" alt="dining3" />
                          </a>
                      </li>
                        <li>
                             <a class="thumb" href="Gallery/images/example/Kitchen1.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/kitchen1.jpg" alt="kitchen1" />
                          </a>
                      </li>
                      <li>
                             <a class="thumb" href="Gallery/images/example/Kitchen2.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/kitchen2.jpg" alt="kitchen2" />
                          </a>
                      </li>
                        <li>
                             <a class="thumb" href="Gallery/images/example/bedroom1.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/bed1.jpg" alt="bed1" />
                          </a>
                      </li>
                       <li>
                             <a class="thumb" href="Gallery/images/example/bedroom2.jpg">
                            <img src="Gallery/images/example/Tudor thumbs/bed2.jpg" alt="bed2" />
                          </a>
                      </li>
                        <li>
                             <a class="thumb" href="Gallery/images/example/bedroom3.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/bed3.jpg" alt="bed3" />
                          </a>
                      </li>
                        <li>
                             <a class="thumb" href="Gallery/images/example/bathroom.jpg">
                            <img src="Gallery/images/example/Tudor thumbs/bath.jpg" alt="bath" />
                          </a>
                        </li>
                    </ul>
                </div>
            <div style="clear: both;"></div>
        </div>
    </div>
    <div id="info">
        <p class="style4">Content for info</p>
    </div>
    <div id="specs">
        <p class="style4">This content is for specs.</p>
    </div>
</div>
</div>

<script type="text/javascript">
            jQuery(document).ready(function($) {
                // We only want these styles applied when javascript is enabled
                $('div.navigation').css({'width' : '400px', 'float' : 'left'});
                $('div.content').css('display', 'block');
                // Initially set opacity on thumbs and add
                // additional styling for hover effect on thumbs
                var onMouseOutOpacity = 0.67;
                $('#thumbs ul.thumbs li').opacityrollover({
                    mouseOutOpacity:   onMouseOutOpacity,
                    mouseOverOpacity: 1.0,
                    fadeSpeed:         'fast',
                    exemptionSelector: '.selected'
                // Initialize Advanced Galleriffic Gallery
                var gallery = $('#thumbs').galleriffic({
                    delay:                     2500,
                    numThumbs:                 15,
                    preloadAhead:              10,
                    enableTopPager:            true,
                    enableBottomPager:         true,
                    maxPagesToShow:            7,
                    imageContainerSel:         '#slideshow',
                    controlsContainerSel:      '#controls',
                    captionContainerSel:       '#caption',
                    loadingContainerSel:       '#loading',
                    renderSSControls:          true,
                    renderNavControls:         true,
                    playLinkText:              'Play Slideshow',
                    pauseLinkText:             'Pause Slideshow',
                    prevLinkText:              '&lsaquo; Previous Photo',
                    nextLinkText:              'Next Photo &rsaquo;',
                    nextPageLinkText:          'Next &rsaquo;',
                    prevPageLinkText:          '&lsaquo; Prev',
                    enableHistory:             false,
                    autoStart:                 false,
                    syncTransitions:           true,
                    defaultTransitionDuration: 900,
                    onSlideChange:             function(prevIndex, nextIndex) {
                        // 'this' refers to the gallery, which is an extension of $('#thumbs')
                        this.find('ul.thumbs').children()
                            .eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end()
                            .eq(nextIndex).fadeTo('fast', 1.0);
                    onPageTransitionOut:       function(callback) {
                        this.fadeTo('fast', 0.0, callback);
                    onPageTransitionIn:        function() {
                        this.fadeTo('fast', 1.0);
</script>
</body>

</html>

Sure thing:
http://www.acresllc.net/TA501001.html

Video & voice sync in menu background

I have a problem with a video clip used as a menu background. It is 25 seconds, a talking head, but I cannot get the voice and video to sync. All movies in this iDVD v 6.04 project sync fine. The movies and background clips were created in FC Express and then exported as Quicktime movies. The exported .mov files play fine in Quicktime. I did delete the old .mov file, re-export it from FCE and drop it into the menu background box but it's still out of sync. I deleted my preferences for iDVD in Library/Preferences and restarted my computer but this didn't work either. I have made other movies where the voice syncs fine in the background, but it isn't working here. I have not burned an image to see if it works as a completed DVD; it's a long DVD and that seems unlikely.
I would appreciate any thoughts.

Preview doesn't always portray things accurately, so you might just let your computer work overnight on a disc image, and see how that behaves.
John

DVD menu background not working in some players only

I put together a DVD in DVDSP 3 which works fine on most players. However on some players the menu backgrounds are grey instead of the graphic that should be there, and the buttons all say "Introduction" instead of having the proper titles. The first Main Menu looks fine and works properly. But the other menus don't show the background images at all.
I've tried using JPG, TIF and MPEG-2 files for the backgrounds on those menus, but none of those file formats works. The buttons all function properly and go to the correct targets, but the button text is the same wrong text on all the buttons. Also, the transitions work fine. And the tracks all play fine. It's just the non-Main menus that have the problem, and only on some DVD Players.
The specific players that have the problem are the Sony DVP-NS55P and the Philips DVP3140, both set top players.
Has anyone seen this type of behavior? And fixed it?

I have a similar problem. When I create a movie background and test in the simulator, the movie doesn't play and I get the grey screen with all the buttons and menus. The DVD created only plays the movie background only after you click a button and it tries to move on to the next track. I have never had a problem before.

CS5 Encore Animated Menu Rendering Problem

Anybody who could help! I am still experimenting but haven't find the solution (either very simple, or a serious bug ). Here is the problem: If I do any edit on the menu after setting the poster frames and/or inserting a motion (avi) or still (wav) background and re-render the menu, it plays the audio but shows the highlights only on a black background. Before rendering, all the (non-moving) background and/or the button pictures can be seen. For a simple experiment, I use the "NTSC Blank Menu" from the "General" Set in the Library panel with the "Drive-in Video Button". My only solution at this point is to start from the beginning with the Blank Menu and copy everything from the non-functioning menu, and insert the background and/or the button pictures (via the poster frame selection), but do not touch anything at this point, and render it, it works as it supposed to. I checked the layers in Photoshop and there is no difference between the functioning and non-functioning menu layer sets. (It points to the animation part as a possible culprit in Encore.) Also, I couldn't find any way to just remove/reinsert the background/button pictures and make it work. This might even be a quirk only with this menu? I would greatly appreciate any suggestion. - Laci.

Hi LaciG,
I just encountered the same problem tonight. So I knew exactly what you were refering to. I tried several approaches to work around this issue including erasing the motion menu background source file and re-importing in and starting the menu from scratch again and neither worked. Eventually I did find a work around here it goes: First I erased the buggy menu and motion menu source file (AVI). Next I copied the whole Encore project file and renamed it. Then I copied and renamed the avi file I used as the motion menu. After this I went in and used the template menu I originally used but renamed it in the asset list. Like you said when ever you mess with the menu like changing the chapter timeline poster or such, it messes up the render. So I made sure everything was the way it needed to be then added the AVI to the motion menu. I re-rendered and it worked. I know this is convoluted but it works, I guess this a good start but I may work on finding out what specific step it was in the process that did it. I had a similar problem in CS4 but could never figure out how to fix it and now that I have Windows 7 using CS4 Encore was a nightmare so I switched to CS5 and ran into the same bug as you. Well I hope this helps

Embed an external view into a tabbed menu

Hi All,
I'm a beginner in WebDynpro Java.
Could you please help me to embed an external view into a tabbed menu in WebDynpro Java?
Please help with your solutions.
Thank you.
Regards,
Sari

hi sari,
     Inside tabbed menu you can't use external view.
     For your problem you can do .
     1. copy your external view ui element from root elements..
     2. paste into seprate tabs.
Another Solution
     1. Inside window controller you can create view set in two division..
     2. First Devision for your navigation menu .
     3. Second Devision For your External views
Thanks & Best Regards
Aasif Shah

Menu background image size

Hi...if I follow this link http://docs.info.apple.com/article.html?path=iDVD/6.0/en/17.html and the instructions for preparing menu background images. My images still get cropped. Does anyone know the real sizes that will fit perfectly?
From the Apple link:
"If you want your images to fit the DVD window exactly, use an image-editing application to crop and resize the images to the following dimensions:
720 x 540 pixels for standard video in NTSC format
854 x 480 pixels for widescreen in NTSC format
768 x 576 pixels for standard video in PAL format
1024 x 576 pixels for widescreen in PAL format"
Many thanks in advance

Shingy,
Today there is an update to iDVD (as well as other iApps) that you should make.
After doing the update this is what I found:
I'm not sure if the things I'm seeing are a result of the update, but after updating I have further defined the problem.
The problem now seems to be in figuring out the proper background size when using a widescreen theme converted to 4:3
Widescreen as widescreen and 4:3 as 4:3 work as expected in PAL.
So, if you stick with the originally discussed image sizes for PAL you will be OK AS LONG AS you don't try to use a widescreen theme as a 4:3 theme. (I didn't try using a 4:3 theme as widescreen.)

Menu background blacks out after 10-15 seconds

Using Encore in Production Premium CS3 and simple menus from library, suddenly menu backgrounds are disappearing after 10-15seconds.When running "preview" before burning a disc, things appear normal. Project check reveals no items. Buttons, titles, and audio continue to play normally against a black background. These exact menus, with audio, have worked on 50 different projects over the past two years, but crashed today! I have not changed any hardware or software, so this problem is perplexing, annoying and time consuming. I have tried several different menus, HD, widescreen, animation and no animation.
Any ideas greatly appreciated.....

The duration is whatever audio track I've selected, i.e. 1 min 59sec.
The "hold forever" box is greyed out and I can't figure out how to cjange that, so I cannot check the box.
Loop Point is 00;00;00;00.
The thing that puzzles me is I'm using a library menu (NTSC_Television Menu) which I've used successfully about a month ago. Preferences are all default and I can't really think of anything I've fooled with in the program.
Is an uninstall/reinstall of Production Studio Premium likely to help? Hate to do that since it takes so long.
TIA

Tab menu background problem

Similar Messages

Maybe you are looking for