| How to set clicked Call to Action?
|
toplisek
msg:4459393 | 11:55 am on May 30, 2012 (gmt 0) |
I have defined button, but how to set clicked button with expanded/collapsed menu items? I like to expand UL and LI items using Jquery? Clicked button should expand menu items and collapse.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title></title>
<style type="text/css">
/*<![CDATA[*/
#calltoactionarea .clickarea {
border-radius: 5px 5px 0 0;
}
#calltoactionarea .clickarea {
border-radius: 5px 5px 0 0;
}
.calltoaction {
border-radius: 5px 5px 5px 5px;
color: #000000;
cursor: pointer;
display: inline-block;
position: relative;
text-decoration: none;
}
/*]]>*/
</style>
</head>
<body>
<div class="#calltoactionarea calltoaction clickarea">Basic features</div>
</body>
</html>
|
companyou
msg:4459618 | 9:16 pm on May 30, 2012 (gmt 0) |
I think it could be something like:
$('#IdOfTheButton').click(function(e){$('#IdOfTheUlToShow').show();});
$('#IdOfTheUlToShow').mouseout(function(){$(this).hide();});
|
toplisek
msg:4459787 | 8:08 am on May 31, 2012 (gmt 0) |
There is nice example:
[mathachew.com...]
Maybe this is the best:
<script type="text/javascript">
$(document).ready(function() {
setTimeout(function() {
// Appear/Disappear
$('#menu4 > li > a.expanded + ul').show();
$('#menu4 > li > a').click(function() {
$(this).toggleClass('expanded').toggleClass('collapsed').parent().find('> ul').toggle();
});
$('#example4 .expand_all').click(function() {
$('#menu4 > li > a.collapsed').addClass('expanded').removeClass('collapsed').parent().find('> ul').show();
});
$('#example4 .collapse_all').click(function() {
$('#menu4 > li > a.expanded').addClass('collapsed').removeClass('expanded').parent().find('> ul').hide();
});
}, 250);
});
</script>
|
|
|
