I’ve been to various js forums with no luck so I’m asking here. I know this is stupid simple to fix and there are numerous examples online but I just can’t seem to get it working.
Using jQuery I have a form that’s hidden in a div which can be toggled open/close via a text link. This part works fine. The problem is that the form is visible during page load then is hidden as it should be which results in a noticeable flash of content.
I just can’t stop the flash without compromising accessibility.
Todd
HTML
<div id="accordion">
<h2><a href="#" id="link1" class="show_hide">Contact Norbert</a></h2>
<form id="form1" action="/who/norbert-wetzel.php" method="post">
<div class="slider">
<div>
<label for="form1_name">Name</label>
<input id="form1_name" name="name" class="text" type="text" required="required" /> *
</div>
<div>
<label for="form1_email">Email</label>
<input id="form1_email" name="email" class="text" type="email" placeholder="email@hidden" required="required" /> *
</div>
<div>
<label for="form1_message">Message</label>
<textarea id="form1_message" name="message" cols="30" rows="4"></textarea>
</div>
<div>
<input value="Submit" type="submit" />
</div>
</div>
</form>
</div>
jQuery
$(document).ready(function() {
$('.slider').hide()
$('a#link1').click(function() {
$('.slider').slideToggle('400');
$(this).text($(this).text() == 'Contact' ? 'Hide' : 'Contact');
return false;
});
});
dynamo mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options