jQuery is the easiest with flash but with keyframes in css3 with no flash are your choices.
Example code :
<html>
<head><title>Slide transaction</title><head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
$(window).ready(function(){
$("#btn").click(function(){
$(".slide1").animate({
width : 'toggle'
},1000,function () { $(".slide2").animate({
width : 'toggle'
},1000);});
});
});
</script>
<style>
.slide1 {
background-color : yellowgreen;
width:100%;
height : 250px;
display : block;
}
.slide2 {
background-color : darkblue;
width : 100%;
height : 250px;
display: none;
}
</style>
<body>
<div class="slide1">
This is slide 1.
</div>
<div class="slide2">
This is slide 2
</div>
<input type="button" id="btn" value="Click Me!" style="position:absolute;top:400px;"/>
</body>
</html>
0
solved I want to do a Web Slide Transaction [closed]