Databases
StackOverflow2013
Postsdbo
PO
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>Explaining the function:</p> <pre><code>(//this and the bottom closure executes the function inside. function fade(){//the function is named fade (s.opacity-=.1)//sets the opacity to current opacity-0.1, &lt;0? // if the opacity - 0.1 is smaller than 0 ('&lt;' = smaller then) s.display="none" // set display to none : // else setTimeout(fade,40) // set a timer of 40 ms and execute the function fade again } )(); </code></pre> <p>this is a nice javascript way to play around with a style but:</p> <p>1.it's written enterly in javascript</p> <p>with css3 you have such animations without the need of javascript and the cool part of it is that the browser (with some tricks) uses hw gpu acceleration and so the animation is very fluid. if you need this type of animation in very old browsers with no css3 support then yeah u need this but also some polyfills and the use of ie filter to set the opacity.</p> <p>2.it sets the display to none</p> <p>setting an element to display:none is not a good way to do it if u plan to reuse the element. becaue if u want to show it again it has to redraw it.</p> <p>3.it uses a setTimeout</p> <p>setTimeout is as bad choice always.</p> <p>Now to the answer:</p> <p>i don't know exactly what do you wanna achieve but </p> <p>look at this example (this works in chrome and safari ,android and ios) but can be changed towork on most browsers.</p> <pre><code>&lt;!doctype html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt;example&lt;/title&gt; &lt;style&gt; div{ background-color:#fc0; -webkit-transition:opacity 1500ms ease; opacity:1; } div.hide{ opacity:0; } &lt;/style&gt; &lt;script&gt; var changeclass=function(){ this.classList.add('hide'); } window.onload=function(){ var firstDiv=document.getElementsByTagName('div')[0]; firstDiv.addEventListener('mouseover',changeclass,false); } &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;div&gt;Hello&lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>i create a css class for my element. <code>div</code></p> <p>inside this div i set the css3 property transition toanimate the opacity with a easing and 1500 milliseconds</p> <p>and an extra class to hide it <code>div.hide</code></p> <p>this contains only the opacity set to 0.</p> <p>now in my example i hide the element on mouseover.</p> <p>so when the my div element has loaded (<code>window.onload</code>) i add an eventhandler (<code>mouseover</code>)</p> <p>to change the class of my div element, which i called <code>changeclass</code>.</p>
    singulars
    1. This table or related slice is empty.
    1. POjavascript fade out (vanilla js example) not working for me
      singulars
      1. PTQuestion
    1. PTAnswer
    1. UScocco
    1. UScocco
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. POjavascript fade out (vanilla js example) not working for me
      singulars
      1. PTQuestion
    1. This table or related slice is empty.
    1. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTAcceptedByOriginator
    2. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTUpMod
    3. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTUpMod
    1. COThanks for your answer, Do you also know why it doesn't completly fade out in chrome's latest version? In firefox it works fine...
      singulars
      1. PO
      1. USuser1081577
    2. COi think it's because putting a setter (s.display="none") in a shorthand function is wrong.so prolly new chrome creates an error.. but yeah there are no errors in console.
      singulars
      1. PO
      1. UScocco
 

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