Pergunta

I know nothing about JavaScript (the main reason I chose to use Skrollr), and have been having issues with getting Skrollr working. I put this code at the end of my webpage:

<script type="text/javascript" src="js/skrollr.min.js"></script> <script type="text/javascript"> var s = skrollr.init(); </script>

Then I went to work. To test, I added the animation shown in the Skrollr documentation, where the text changes color, using this code:

<p class="lead" data-0="background-color:rgb(0,0,255);" data-500="background-color:(rgb255,0,0):">Blah blah blah.</p>

I upload it, no results. So I tried taking out the class, I'm a pretty mediocre coder at best, I just play with stuff, so I don't know if what I'm trying to do isn't possible. I think the class and the data- are conflicting. So I reupload, and by jove, still nothing. What's up with this? Here's a link to the page (I was testing Skrollr on the first section, the text that begins "An introductory studio course..."): http://jonathanalumbaugh.altervista.org/courserequests/photographyone.html

I'll also note that I want to use this to make the circled images expand from nothing to the size they are, kind of make them pop out as you scroll along, and make the "JA" cover image parallax scroll. But I want to get this thing working first. I'd also like to get the smooth scrolling thing turned but I have no idea where to do that. Probably a really simple question, so apologies in advance for the stupid questions.

I'm not sure whether I should ask another question for this or not, but once this does work, is it possible to animate stuff that already has a class applied to it, like I tried to do with <p class=lead data-0="background...?

I FORGOT TO ADD: Dreamweaver says "there is a syntax error on line 1 of skroll.min.js. Code hinting may not work until you fix this error." I don't know why, I haven't touched it. The first line of skroll.min.js says <!DOCTYPE html>.

Foi útil?

Solução

You have mistake in this code (rgb), correct should be:

<p class="lead" data-0="background-color:rgb(0,0,255);" data-500="background-color: rgb(255,0,0)">Blah blah blah.</p>
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top