By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
424,991 Members | 1,887 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 424,991 IT Pros & Developers. It's quick & easy.

Doubke marquee div by JavaScript

P: 2
I want to create a code like including two div
First div will lunch by marquee style left to right 300px when a person click on open then I want to open menus inside div with marquee style.
I want menus will appear after 5 second of first div appearance. I create the code but I cant set up the delaying of menu
I mean all contents are starting at one time
Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE html>
  2. <html>
  3. <head><style>body{background-color:black; color:white;}.cdv{background-color:gray; width:200px; height:40px; font-size:20px; border-bottom:1px outset red; border-bottom-right-radius:2em; padding:5px 10px 0px;}
  4. .csv{width:300px; height:30px; font-size:10px; padding:10px 0px 0px;}</style>
  5. <meta charset="ISO-8859-1">
  6. <script type="text/
  7. javascript">
  8. function expandCollapse(showHide) {
  9. var hideShowDiv =document.getElementById(showHide);
  10. var label =
  11. document.getElementById("expand");
  12. if (hideShowDiv.style.display =='none') {
  13. label.innerHTML= label.innerHTML.replace("[+]", "[-]");
  14. hideShowDiv.style.display = 'block';} else {
  15. label.innerHTML= label.innerHTML.replace("[-]", "[+]");
  16. hideShowDiv.style.display = 'none';
  17. }
  18. }
  19. </script>
  20. <title>Expand collapse
  21. sample</title>
  22. </head>
  23. <body>
  24. <div>
  25. <div style="background-color:black; width:100px; height:20px; padding:0px 0px 0px; color:aqua;" onclick="expandCollapse('showHide
  26. ');" id="expand">[+]Open Tray 
  27. </div>
  28. </div>
  29. <div id="showHide"
  30. style="display: none; height:0px;">
  31. <marquee behavior="slide" direction="right" scrollamount="5" loop="1"><div style="height:600px; border-right:3px solid red; border-top:1px solid red; border-bottom:18px inset red; width:200px; background-color:white; border-bottom-right-radiis:2em; border-top-right-radius:2em; "><marquee behavior="slide" direction="right" scrollamount="5" loop="1"><div class="cdv">Hello</div></marquee><hr color="red" align="center" width="150"><a href="onclick.html"><div class="csv"><b>Onclick</b></div></a></marquee></div>
  32. </div>
  33. </body>
  34. </html>
  35. <div style=""><b>Top content should go through into this <hr/></b></div>
  36.  
  37.  
  38. </body>
  39. </html>
  40.  
  41.  
  42. <!DOCTYPE html>
  43. <html>
  44. <body>
  45.  
  46. <p>Click "Try it". Wait 3 seconds. The page will alert "Hello".</p>
  47.  
  48. <button onclick="setTimeout(function(){alert('Hello')},3000);">
  49. Try it</button>
  50.  
  51. </body>
  52. </html>
  53.  
Jan 29 '15 #1
Share this question for a faster answer!
Share on Google+

Post your reply

Sign in to post your reply or Sign up for a free account.