Jump to content

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>  

 

Link to comment
https://forums.phpfreaks.com/topic/263517-jquery-questions/#findComment-1350460
Share on other sites

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!!!

Link to comment
https://forums.phpfreaks.com/topic/263517-jquery-questions/#findComment-1350573
Share on other sites

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>

Link to comment
https://forums.phpfreaks.com/topic/263517-jquery-questions/#findComment-1350670
Share on other sites

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.

Link to comment
https://forums.phpfreaks.com/topic/263517-jquery-questions/#findComment-1350685
Share on other sites

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.

Link to comment
https://forums.phpfreaks.com/topic/263517-jquery-questions/#findComment-1350720
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • 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.