Databases
StackOverflow2013
Postsdbo
POjQuery fade out div not displaying border properly when on top of flash object
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery fade out div not displaying border properly when on top of flash object
    primarykey
    data
    text
    <p>First time posting... go easy on me :-)</p> <p>I have a QR Code test landing page for a client: </p> <p><a href="http://www.woodfold.com/qr" rel="nofollow">http://www.woodfold.com/qr</a> </p> <p>I did not develop the site, but am the one who is now in charge of changes. </p> <p>For now, the client just wants a simple thank you box to appear and then fade out when the QR Code page is accessed. I wrote a simple div, css and used jQuery for a fade out effect.</p> <p>The site has a .swf movie/rotater at the top of the screen.</p> <p>The code works fine as long as the browser is sized larger enough for the QR thank you message to show below the movie. </p> <p>If the browser/screen is sized small enough to push the message into the movie area FF and Opera do not render the rounded corners correctly. They are rendered correctly when the message appears below the movie.</p> <p>I'm sure I am missing something stupid simple, but... Anyone have an idea about what is causing this? Here is the relevant code snippets. </p> <pre><code> &lt;div id="qrThanks"&gt; &lt;img src="../i/qrSmall.png" title="Woodfold QR Code" alt="Woodfold QR Code" /&gt; &lt;p class="qrContent"&gt;Thank you for using Woodfold's QR Code!&lt;/p&gt; &lt;/div&gt; &lt;div id="contentContainer"&gt; &lt;div id="flashContainer"&gt; &lt;object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="731" height="312"&gt; &lt;param name="movie" value="http://woodfold.com/flash/superhomeFlash.swf" /&gt; &lt;param name="wmode" value="transparent"&gt; &lt;!--[if !IE]&gt;--&gt; &lt;object type="application/x-shockwave-flash" data="http://woodfold.com/flash/superhomeFlash.swf" width="731" height="312"&gt; &lt;!--&lt;![endif]--&gt; &lt;img src="slide.gif" alt="slide" width="731" height="312" /&gt; &lt;!--[if !IE]&gt;--&gt; &lt;/object&gt; &lt;!--&lt;![endif]--&gt; &lt;/object&gt; &lt;/div&gt; </code></pre> <p>js/jQuery</p> <pre><code>&lt;script type="text/javascript" src="../scriptz/jquery-1.9.1.min.js"&gt;&lt;/script&gt; &lt;script type="text/javascript"&gt; jQuery(document).ready(function(){ $('div#qrThanks').show(); window.setTimeout(function() { $('div#qrThanks').fadeOut('slow'); }, 2000); }); &lt;/script&gt; </code></pre> <p>CSS</p> <pre><code>#qrThanks { position: absolute; left: 50%; top: 50%; display: block; margin: -100px 0 0 -250px; text-align: center; z-index: 1000; width: 500px; height: 100px; background-color: #FFF; box-shadow: 5px 5px 3px #000; border: 10px solid #ccc; border-radius: 10px; } #qrThanks img { margin: 20px 10px 20px 20px; padding: 0px; width: 60px; float: left; box-shadow: 5px 5px 3px #000; } .qrContent { display: block; margin: auto 0px; font-size: 20px; line-height: 100px; } </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. This table or related slice is empty.
    1. USBitBug
    plurals
    1. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POjQuery fade out div not displaying border properly when on top of flash object
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. POjQuery fade out div not displaying border properly when on top of flash object
      1. This table or related slice is empty.
      1. VTUpMod
    3. VO
      singulars
      1. POjQuery fade out div not displaying border properly when on top of flash object
      1. This table or related slice is empty.
      1. VTUpMod
    1. This table or related slice is empty.
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload