CODEWITHSUNDEEP
javascript
MrEhawk82
MrEhawk82

Reputation: 819

Text slide show not displaying

I'm trying to make a div that changes text every few seconds. I'm trying to do this in JavaScript only. I don't want to use jquery. The console isn't showing any errors, and I made a few alerts to test where the disconnect is but cannot find out what i'm doing wrong. Please help, and thanks in advance.

HTML

<div id="ss"></div>

JS

(function() {
  var UIlogic = {
    loadData: function() {
      var ss_i = 0;
      var ss_array = ["Reading","Redstone","Family","Engineering","Hockey"];
      var ss_elem;
      ss_elem = document.getElementById('ss').innerHTML;

      function ssNext(){
        ss_i++;
        ss_elem.style.opacity = 0;
        if(ss_i > (ss_array.length - 1)){
          ss_i = 0;
        }
        setTimeout('ssSlide', 1000);
      }

      function ssSlide(){
        ss_elem = ss_array[ss_i];
        ss_elem.style.opacity = 1;
        setTimeout('ssNext', 2000);
      }
    }
  };
  window.onload = function() {
    UIlogic.loadData();
  };
})();

Upvotes: 0

Views: 54

Answers (2)

Andre Lehnert
Andre Lehnert

Reputation: 531

  1. if you want to call a function as a string in quotes you have to add (), I think - I never use it in this way.
  2. Better do this not as String. Better is: setTimeout(fct,100)
  3. There are scope problems. Define the textchange-functions outer of loadData

Upvotes: 2

colecmc
colecmc

Reputation: 3318

You never called your slide functions. Have a look at this to get started: http://jsbin.com/yutuji/1/

Upvotes: 2

Related Questions