November 12, 201312 yr Dear, I've got a problem which I can't seem to solve myself. I'm working with a 'contact'-footer that slides open when clicked. It works as I expect it to. BUT...when I visit the website for the first time, the sliding part is open and closes when it has been completely loaded ( I guess that's the problem). That shouldn't be happening. I would like the 'contact'-footer to be closed the first time you visit the website as well. Website = www.liberant.be Is there anyone who can help me solve this problem? Thank you very much in advance. Best regards, Dennis
November 15, 201312 yr Is this jQuery? If so, you can probably set the height of the contact element when the page is loaded, so you can incidentally set it to 0. Also, check if the jQuery is loaded AFTER the rest of the document is loaded, this is typically done using this piece of code: $(document).ready(function() { //Run code when the page is fully loaded //Your code here });
November 27, 201312 yr Author Dear, Thank you for reply... I don't understand exactly what you mean... Does the code below help you? var Hide = "";var varHt = 0;var Ht = "";var x = 0;var y = 10;var z = 4;var foo = new Array();var Speed = "";function setup() { foo = document.getElementsByTagName("div"); for (i=0;i<foo.length;i++) { if (foo.className == "hidden") { Hide = foo.id; } } Ht = document.getElementById(Hide).offsetHeight; Speed = Hide.substring(Hide.lastIndexOf('-')+1); document.getElementById(Hide).style.height = '0px'; document.getElementById('toggle').style.display = 'inline'; if (Speed == 1) { y = 100; z = 1; } if (Speed == 2) { y = 70; z = 1; } if (Speed == 3) { y = 40; z = 1; } if (Speed == 4) { y = 20; z = 1; } if (Speed == 5) { y = 10; z = 1; } if (Speed == 6) { y = 10; z = 2; } if (Speed == 7) { y = 10; z = 4; } if (Speed == { y = 10; z = 7; } if (Speed == 9) { y = 10; z = 10; }}function toggle() { if (x === 0) { document.getElementById(Hide).style.height = varHt+'px'; if (((Ht-varHt) < z) && (varHt !== Ht)) { varHt = Ht; } else { varHt = varHt+z; } if (varHt <= Ht) { setTimeout('toggle()',y); } if (varHt > Ht) { varHt = Ht; x = 1; } } else { document.getElementById(Hide).style.height = varHt+'px'; varHt = varHt-z; if ((Ht-varHt) <= Ht) { setTimeout('toggle()',y); } if ((Ht-varHt) > Ht) { varHt = 0; document.getElementById(Hide).style.height = varHt+'px'; x = 0; } }} Thank you in advance... Best regards,Dennis
November 27, 201312 yr I am going to agree with SimpleSucess you need to add the JS document ready so that the code for the contact form isn't loaded until the page has fully loaded, Putting JS scripts in the footer may also be a way to stop things like this happening
November 28, 201312 yr Author Doesn't seem to work. Below is the code I'm using: <!-- InstanceBeginEditable name="doctitle" --><title>Liberant</title><!-- InstanceEndEditable --><!-- InstanceBeginEditable name="head" --><!-- InstanceEndEditable --><link rel="shortcut icon" type="image/x-icon" href="Images/favicon.ico"><link href="Css/maincss.css" rel="stylesheet" type="text/css" /><link href='http://fonts.googleapis.com/css?family=Crimson+Text:400,400italic,600,600italic,700,700italic' rel='stylesheet' type='text/css'></head><body onload="setup();initialize()"><div id="wrapper"> <div id="header"> <div id="navigation"><!-- InstanceBeginEditable name="navigation" --> <ul style="list-style-type: none;"> <li style="color:#000;">home</li> <li><a style="text-decoration:none; color:#616161;" href="NL/profiel.html">profiel</a></li> <li><a style="text-decoration:none; color:#616161;" href="NL/diensten.html">diensten</a></li> <li><a style="text-decoration:none; color:#616161;" href="NL/advocaten.html">advocaten</a></li> <li><a style="text-decoration:none; color:#616161;" href="NL/erelonen&kosten.html">erelonen & kosten</a></li> </ul> <!-- InstanceEndEditable --></div><!--end navigation--> <div id="logo"> <img src="Images/Logo%20Liberant.jpg" width="258" height="76" alt="Liberant" /> </div><!--end logo--> <div id="languages"><!-- InstanceBeginEditable name="languages" --> <ul style="list-style-type: none;"> <li class="activelanguage">nl</li> <li><a href="indexFR.html" style="text-decoration:none; color:#616161;">fr</a></li> <li><a href="indexENG.html" style="text-decoration:none; color:#616161;">en</a></li> </ul> <!-- InstanceEndEditable --></div><!--end languages--> </div><!--end header--> <div id="center"> <div id="banner" style=" box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);"><!-- InstanceBeginEditable name="banner" --> <img src="Images/foto_index.jpg" width="900" height="397" alt="Home" /> <!-- InstanceEndEditable --></div><!--end banner--> <div id="content"><!-- InstanceBeginEditable name="content" --> <p> </p> <h1 class="h1" style="color:#000000; text-align:center; ;">Welkom.</h1> <p style="text-align:center; ; color:#616161;">Liberant is een advocatenkantoor in Antwerpen,<br /> voor mensen én ondernemingen.</p> <p style="text-align:center; ; color:#616161;">In alles wat we doen, staat het belang van de cliënt centraal.</p> <p style="text-align:center; ; color:#616161;"> </p> <!--<div id="leftcontent">--> <!-- InstanceEndEditable --></div><!--end content--> </div><!--end center--> <div id="footer"> <script type="text/javascript" src="Scripts/slider.js"></script><meta name="viewport" content="initial-scale=1.0, user-scalable=no" /><script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script><script type="text/javascript"> function initialize() { var latlng = new google.maps.LatLng(51.2127132, 4.4104579); var settings = { zoom: 15, center: latlng, mapControl: false, navigationControl: false, streetViewControl: false, mapTypeControl: false, mapTypeControlOptions: false, navigationControl: false, navigationControlOptions: false, mapTypeId: google.maps.MapTypeId.ROADMAP };var map = new google.maps.Map(document.getElementById("map_canvas"), settings); var companyPos = new google.maps.LatLng(51.2127132, 4.4104579); var companyMarker = new google.maps.Marker({ position: companyPos, map: map, title:"Liberant" });}</script> <!-- InstanceBeginEditable name="footer" --> <div id="foo-7" class="hidden"><div id="leftfooter"><p style="margin-top:0px; color:#616161; text-align:justify;">Onze kantoren aan de Frankrijklei 107 in Antwerpen zijn centraal gelegen, in de buurt van alle uitvalswegen.</p> <table width="251" border="0"> <tbody><tr> <th width="100" height="20px" scope="row">adres:</th> <td width="151" height="20px">Frankrijklei 107</td> </tr> <tr> <th scope="row"> </th> <td>B-2000 Antwerpen</td> </tr> <tr> <th scope="row"> </th> <td> </td> </tr> <tr> <th scope="row">telefoon:</th> <td>+32.(0)3.233.05.80</td> </tr> <tr> <th scope="row">fax:</th> <td>+32 .(0)3.233.05.99</td> </tr> <tr> <th scope="row">e-mail:</th> <td>info@liberant.be</td> </tr> <tr> <th scope="row">KBO nr.:</th> <td>848.872.635</td> </tr> </tbody></table><p style="color:#616161;text-align:justify;">Liberant heeft de vorm van een burgerlijke maatschap zonder rechtspersoonlijkheid. Vennoten zijn: François Lebacq, Marc Buyens, Tom De Meester en Leslie Roelants.</p><p style="color:#616161;text-align:justify;">De administratie en het onthaal worden verzorgd door Nadine Van Bavel.</p> </div> <div id="righttfooter" style="float:right;"> <div id="map_canvas" style="width:510px; height:424px; margin-top:20px;"></div> </div> </div> <a href="#contact" onclick="toggle();" id="toggle" style="outline:none;"> <img style="outline:none; border:none; margin-bottom:16px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.1);" src="Images/Contactline.jpg" width="900" height="40" alt="Contact" /></a> <!-- InstanceEndEditable --> </div></div><!--end wrapper-->
Create an account or sign in to comment