• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 475
  • Last Modified:

slideLeft and fadeIn

I wounder if there is a possibility to slide left and also fadeIn at the same time.
I have 5 text boxes i am trying to slide them from left to right but to make it more elegant i trying to play with opacity or fadeIn.

i would be thankful is someone have a suggestion.

$("#slides div").hide();
	$('#slide1').slideLeftShow();

Open in new window

0
Refael
Asked:
Refael
  • 2
  • 2
1 Solution
 
designatedinitializerCommented:
do it like this:
<head> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script> 
    <script> 
        // wait for the DOM to be loaded 
        $(document).ready(function() { 
			$("#slides div").animate({
    opacity: 0,
    left: 100,
  }, 1000);
		});
    </script> 
</head> 
<body>
<div id="slides">
	<div style="width:50px;height:50px;background-color:red;display:block;position:relative;left:0px;">aa</div>
</div>
</body>

Open in new window

0
 
RefaelAuthor Commented:
Hi designatedinitializer,

Thank you.

I need it to fadeIn while it slideLeft and not fadeOut.
0
 
designatedinitializerCommented:
You just need to invert the settings.
Like this:
<head> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script> 
    <script> 
        // wait for the DOM to be loaded 
        $(document).ready(function() { 
			$("#slides div").animate({
    opacity: 1,
    left: 100,
  }, 1000);
		});
    </script> 
</head> 
<body>
<div id="slides">
	<div style="width:50px;height:50px;background-color:red;display:block;position:relative;left:0px;opacity:0;">aa</div>
</div>
</body>

Open in new window

0
 
RefaelAuthor Commented:
Thank you!
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Cloud Class® Course: Microsoft Exchange Server

The MCTS: Microsoft Exchange Server 2010 certification validates your skills in supporting the maintenance and administration of the Exchange servers in an enterprise environment. Learn everything you need to know with this course.

  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now