In html language you used to use marquee to create text running on you web page it is very simple and easy to use and modify. but now i would like to show other you instant of this code by using jquery scripting language. it is very powerful and smooth.
you can use it in WordPress and blogger. by follow my step. just copy code and pass it into you code file.
Code:
1.Link jquery file store in Google drive
<script src="https://googledrive.com/host/0B_IbO3cULuN8RFlYLVl5eG96Nnc" type="text/javascript"></script><!-- jquery-1.3.2.min.js -->
<script src="https://googledrive.com/host/0B_IbO3cULuN8YTVKVUpVa1lLN28" type="text/javascript"></script><!-- jquery.pause.js -->
<script src="https://googledrive.com/host/0B_IbO3cULuN8Nkk0NnV2NEdYcXc" type="text/javascript"></script><!-- jquery.marquee.js -->
2.CSS:
<style type="text/css">
.marquee-with-options{
float: right;
margin-top: 5px;
width: 800px;
border: solid thin red;
float:left;
overflow:hidden;
}
</style>
3.Javascript & Jquery
<script type="text/javascript">
document.documentElement.className = 'js';
</script>
<script>
$(function(){
var $mwo = $('.marquee-with-options');
$('.marquee').marquee();
$('.marquee-with-options').marquee({
//speed in milliseconds of the marquee
speed:9000,
//gap in pixels between the tickers
gap: 300,
//gap in pixels between the tickers
delayBeforeStart: 200,
//'left' or 'right'
direction: 'left',
//true or false - should the marquee be duplicated to show an effect of continues flow
duplicated: false,
//on hover pause the marquee - using jQuery plugin https://github.com/tobia/Pause
pauseOnHover: true
});
});
</script>
4.HTML
<div class='marquee-with-options'>
Monday | Wednesday | Wednesday | Wednesday | Wednesday
</div>
This comment has been removed by a blog administrator.
ReplyDelete