Jump to content

jquery questions


mindapolis

Recommended Posts

Basically I have a list of words I want to fade in and out on the screen.  Do I need to include the jquery.innerfade.js file to make it work? 

 

into this page

<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
li {
list-style-type: none;
display:none;  
}
</style>
/<meta charset="UTF-8" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.js"></script>
<script type="text/javascript" src="http://www.kbcc.cuny.edu/memorial/jack_taub/Documents/jquery.innerfade.js"></script>  
<script type="text/javascript"> 
$(document).ready( 
	function(){ $('#skills').innerFade({
		 animationType: 'slide',
		 speed: 750, 
		 timeout: 2000,
		 type: 'random', 
		 containerHeight: '1em' 
	}); 
} 
);  
</script>
</head>

<body>
  	<ul id="skills">
    	<li><a href="#n1">Website Development </a> </li>
    	<li><a href="#n2">Website Maintenance </a></li>
        <li><a href="#n3">Internet Research</a> </li>
    	<li><a href="#n4">Article Writing</a> </li>
        <li><a href="#n5">Blogging</a></li>
     </ul>
</body>
</html>  

 

I have a list of words & I want each word to fade.  What else do you need to know?

Well wouldn't ya know.

 

It's been a long time since I've used jQuery (we use Mootools at work). I should probably check the manual before opening my mouth I guess.

 

I feel for ya... I'm stuck using Prototype at work.  Bleh!!!

There you go... it'll fade them in and out eternally, exactly like you asked.

<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    var els =[];
    function fade(i) {
        if (els.length <= i) i = 0;
        var el = els[i];
        if (!el) return;
        if (el.is(':visible'))
            el.fadeOut(200, function() {fade(i+1)});
        else
            el.fadeIn(200, function() {fade(i+1)});
    }
    $('#skills li').each(function(i, el) {
        els.push($(el));
    });
    fade(0);
});
</script>
</head>
<body>
    <ul id="skills">
        <li><a href="#n1">Website Development </a> </li>
        <li><a href="#n2">Website Maintenance </a></li>
        <li><a href="#n3">Internet Research</a> </li>
        <li><a href="#n4">Article Writing</a> </li>
        <li><a href="#n5">Blogging</a></li>
    </ul>
</body>
</html>

It 's close, but I want one list item  to fade in and out, the next list item  fade in and out etc.  I was following the example on http://medienfreunde.com/lab/innerfade/

It's not close.  It's EXACTLY what you asked for.  Since you failed to explain in detail (despite my numerous queries), I filled in the blanks.

 

It may not be what you want, but now you're stuck with it.  Maybe you've learned a thing or two about specification in the process.  Good luck.

I'm being mean to drill into your head that vagueness is a bad thing when asking for help.

 

I see now that what you were asking for is a slideshow  (or carousel).  Choice of words is important in this industry. 

 

Do your research and learn what to call things when you talk about them, or you'll get lots of mixed up answers, and you'll frustrate people and waste their time.

 

If you can't at least figure out the name... post a link to an example of what you're looking for.

Well, it was a combination of me not knowing what you were talking about and trying to explain that you need to explain yourself better. 

 

Glad you found what you were looking for.  Hope you learned something about specification in the process.

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.