Member Avatar for vizz

how to split <div></div> into even and odd parts ? And how to slide even parts to top-right & odd parts to bottom-left using jquery?

  • 3 Contributors
  • 7 Replies
  • 143 Views
  • 3 Days Discussion Span
  • Latest Post Latest Post by AleMonteiro
Member Avatar for AleMonteiro

What do you mean by split?

Member Avatar for vizz

I want to make small parts of single div for animating. I want to hide div by splitting it into small pieces with explode effect.

What do you mean by split?

Member Avatar for R.Manojkumar 
<style>
.odd{height:5px; background:#960;}
.even{height:5px; background:#09C;}
</style>

<script src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
			$('div:odd').addClass('odd');
			$('div:even').addClass('even');
})
</script>
<body>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</body>

for more jquery selectors use
http://www.w3schools.com/jquery/jquery_ref_selectors.asp

Member Avatar for vizz

These are multiple div's. I want to divide single div into even and odd parts to animate

<style>
.odd{height:5px; background:#960;}
.even{height:5px; background:#09C;}
</style>

<script src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
			$('div:odd').addClass('odd');
			$('div:even').addClass('even');
})
</script>
<body>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</body>

for more jquery selectors use
http://www.w3schools.com/jquery/jquery_ref_selectors.asp

Member Avatar for AleMonteiro

Something like this?

$(function()
{
    $("#myDivID").children(":odd").animate(); // Animate odd
    $("#myDivID").children(":even").animate(); // Animate even
});
Member Avatar for vizz

Hey, Thanks!

This can be used to animate div, but how to make small parts of single div?


Something like this?

$(function()
{
    $("#myDivID").children(":odd").animate(); // Animate odd
    $("#myDivID").children(":even").animate(); // Animate even
});
Member Avatar for AleMonteiro

I don't think that is possible, at least I never come across something like that.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.