Sliding image by passing parameters through jQuery

Sliding image by passing parameters through jQuery

body>

class="goaslider hideonload"> <img
class="goaslider_bgimage" id="6" src="01.jpg" width="1350" height="900">
          <div
class="goaslider_customhtml"></div>
        </div>
        <div
class="goaslider hideonload"> <img
class="goaslider_bgimage" id="7" src="02.jpg" width="1350" height="900">
          <div
class="goaslider_customhtml"></div>
        </div>
        <div
class="goaslider hideonload"> <img
class="goaslider_bgimage" src="03.jpg" id="1" width="1350" height="900">
          <div
class="goaslider_customhtml"></div>
        </div>
        <div
class="goaslider hideonload"> <img
class="goaslider_bgimage" src="04.jpg" id="2" width="1350" height="900">
          <div
class="goaslider_customhtml"></div>
        </div>
        <div
class="goaslider hideonload"> <img
class="goaslider_bgimage" src="05.jpg" id="3" width="1350" height="900">
          <div
class="goaslider_customhtml"></div>
        </div>
        <div
class="goaslider hideonload"> <img
class="goaslider_bgimage" src="06.jpg" id="4" width="1350" height="900">
          <div
class="goaslider_customhtml"></div>
        </div>
        <div
class="goaslider hideonload"> <img
class="goaslider_bgimage" src="07.jpg" id="5" width="1350" height="900">

</body>

this is my HTML body and here i have declared few classes with total images of 7 that i want to slide over  my background

<script type="text/javascript">

function myfunc(){
   
     var sc = $(".goaslider_bgimage").size();
    var count = 0;
  
    var interval_id=setInterval(function()
        {     
            $(".goaslider_bgimage #"+count).show("slide",{direction:"right"},100);
            $(".goaslider_bgimage #"+count).delay(5000).hide("slide",{direction:"left"},100);

            if(count == sc){
            count = 1;
             }
             else{
            count = count+1;
            }
           
        },5500);
}
    }

</script>

This is my j query that will give me total no. of counts in sc

now a variable count is to be inserted in such a way that it will start from 1to 7 but how can i call my images since "$(".goaslider_bgimage #"+count).show("slide",{direction:"right"},100);" does not worked ,
i need to call every image by its assigned id and thus increment it by placing the entire code in setInterval.
The main issue is in calling every individual image through a variable that will icrement its value.



kbwood.au suggested me to do this :-

  1. function myfunc() {
  2.       var sc = $('.goaslider_bgimage').size();
  3.       var count = 1;
  4.       var interval_id = setInterval(function() {     
  5.             $('#i' + count).show('slide', {direction: 'right'}, 100).delay(5000).
  6.                   hide('slide', {direction: 'left'}, 100);
  7.             count = (count % sc) + 1;
  8.       }, 5500);
  9. }
i tried doing it but its not working, also consulted many blogs but unable to find any solution yet, need urgent help i m in middle of a project and need to be submitted well on time.
Regards
Anubhav