I have two spans laid out side by side. What I want is for the span on the
right to "slide" under the span on the left.
The problem with the code below is that the right-span can't get under the
left-span, so it has to skip a line and then slide into being invisible.
I've tried using z-index and a number of other fixes and nothing seems to be
working -- the issue appears to have something to do with the borders of
each element.
Can anyone help out?
Thanks,
Chris
Here's the code I have so far:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd";>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js";></script>
<script src="http://ui.jquery.com/latest/ui/ui.core.js";></script>
<script src="http://ui.jquery.com/latest/ui/effects.core.js";></
script>
<script src="http://ui.jquery.com/latest/ui/effects.slide.js";></
script
<script>
$(document).ready(function(){
$(".link_div_1").click(function() {
$(".link_span_1").toggle("slide",{}, 500);
});
});
</script>
<style>
.link_div_1 {
text-padding: 1px;
}
.link_span_1 {
text-padding: 1px;
}
</style>
</head>
<body>
<span class="link_div_1">Hey</span>
<span class="link_span_1">Test Span 2</span>
</body>
</html>
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"jQuery UI" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---
