reverse transition?

0 Andre Furfält · August 22, 2014
Hey guys! :) it's difficult to learn javascript for me (All webprogramming languages actually) and i want a div to expand when i click it and expand back to its original form if i click it again (English is not my main language so i dont know every word)

This is how my js file looks like

var height2 = document.getElementById('links').style.height="480px";

function expand(){

   height2 = document.getElementById('links').style.height="480px";
   
};

It's really simple website since it's just for training

Best way to learn js help me? :(

Post a Reply

Replies

Oldest  Newest  Rating
+1 JOhaL jaTT · August 22, 2014
try this mate 
<html>
<head>
<title>test</title>
<style>
body{

background-color:black;
}

#sections_panel{
position:absolute;
left:90px;
top:10px;
width:50px;
height:50px;
background-color:green;

}
</style>
<script>
function toggleNavPanel(x){
    var panel = document.getElementById(x), maxW="300px",maxH="300px";
   panel.style.transition="height 0.3s linear 0s , width 0.3s linear 0s ";// New Line of Code 
   if(panel.style.height == maxH && panel.style.width == maxW){
        panel.style.height = "50px";
        panel.style.width = "50px";
    } else {
        panel.style.height = maxH;
        panel.style.width  =  maxW;
   }
}

</script>
</head>
<body>
<div id="sections_panel" onclick="toggleNavPanel('sections_panel');" ></div>
</body>

</html>
+1 JOhaL jaTT · August 22, 2014
i have just posted new line of code try the main code once again.
+1 JOhaL jaTT · August 22, 2014
you can down load this book http://it-ebooks.info/book/483/ or you can use this link http://www.ecma-international.org/ecma-262/5.1/ to learn JS.
0 Andre Furfält · August 22, 2014
Thanks! You just saved me from being annoyed for the rest of the day :D

I'm still open for suggestions on where i can learn about javascript. Mostly about eventhandlers & if/else statement that's the most important for me, since i didnt know how i should do this on my own.
  • 1

Javascript

107,310 followers
About

A scripting language that is added to standard HTML to create interactive effects, apps, games for the browser.

Links
Moderators