1

I am making a blinking cursor .I need this cursor should blink at the end of data (a data coming after few second) and appending in div.Till now my cursor position is fixed .Now i need to move my cursor at the end of contend.Here is try. http://jsfiddle.net/naveennsit/prUYP/

$(document).on('click', '#call', function(event) {


     setInterval(function(){
   $('#realTimeContents' ).append("kkkkkkkkkk"+'\n');

  },3000);
     setInterval(function(){

cursorAnimation();  
  },600);
});


function cursorAnimation() 
{
   // alert("yy")
  $("div.cursor").animate(
  {
    opacity: 0
  }, "fast", "swing").animate(
  {
    opacity: 1
  }, "fast", "swing");
}

I need result like this

kkkkkkk|
KKKKKK  KKKKKKKK|

KKKKKk  kkkkkkkk  kkkkkkk|
user2648752
  • 2,123
  • 5
  • 21
  • 29

1 Answers1

0

you can try to change .cursor to be "span" and add it inside #realTimeContents and change append for prepend
HTML 

<div data-role="page" id="realTimeScreen" >
 <a href="#" data-role="button" data-corners="false" data-inline="true" id="call" class="" >call</a>
    <div id="realTimeContents" class ="left realtimeContend_h" style="width:97%;"> 
     <span class="cursor" style="font-size:23px;">|</span>
    </div>                       
</div>

JS 

$(document).on('click', '#call', function(event) {
 setInterval(function(){
   $('#realTimeContents' ).prepend("kkkkkkkkkk"+'\n');
  },3000);
 setInterval(function(){

cursorAnimation();  
},600);
});

function cursorAnimation() 
{
  $(".cursor").animate(
  {
    opacity: 0
  }, "fast", "swing").animate(
  {
    opacity: 1
  }, "fast", "swing");
}

http://jsfiddle.net/prUYP/2/

Abraham Uribe
  • 3,118
  • 7
  • 26
  • 34
  • I have one more question..can i ask? – user2648752 Aug 05 '13 at 22:47
  • I need to get scroll event Firstly when i scroll my div i need to get event here is my fiddle http://jsfiddle.net/naveennsit/x7ZyB/ – user2648752 Aug 05 '13 at 22:51
  • No ..!!It is call atumatically when div scroll.I need when user manually scroll by clicking scrollbar .If it is appending I don't do anything ..If user goes above or below then then I need to do same task.. – user2648752 Aug 05 '13 at 23:03
  • Your First answer is working fine in fiddle But not working in real problem when I implement in logic.Mean in my code .checking in IPAD..:( – user2648752 Aug 05 '13 at 23:04
  • maybe you need something like this [http://stackoverflow.com/questions/7035896/detect-whether-scroll-event-was-created-by-user](http://stackoverflow.com/questions/7035896/detect-whether-scroll-event-was-created-by-user) – Abraham Uribe Aug 06 '13 at 14:32