Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

Is there a way to rotate widgets or text blocks with a Flash banner? I had a widget loading a Flash Video loaded by wordTube Flash and YouTube player. The client wanted to rotate this video together with some Flash text (effect showing text being typed). I replaced the Flash text banner by the jQuery Tickertype plugin - better SEO - and I tried Datafeedr to load both alternatively. It allows you to add html and Flash into severa ads per adgroup. But I realized that plugin only rotates ads on page refresh. Any plugin that rotates (ad) blocks every x seconds or minutes?

Update 1

I am testing http://wordpress.org/extend/plugins/randomtext/ , but it does not seem to rotate even though I do not have a caching plugin running.

Update 2

jQuery on jQuery howto Blog seemed promising, but it grabs content from a file and not let's say content from a different HTML element.

Update 3

Checking http://forums.asp.net/t/1777232.aspx/1?Fade+In+Out+between+two+divs for jQuery animate() with 'setTimeoutandfadeIn()andfadeOut()` All rather new to me and wondering if I can combine this Tickertype.

Update 4

I have added some jQuery to rotate two divs, but I cannot seem to be able to keep the text widget I use to rotate these two divs of a fixed size. Here is the basic plugin:

$(document).ready(function () {
        fadeIn_();
    })

    function fadeIn_() {
        $('#flash').fadeIn(2000,
        function () {
            setTimeout("$('#flash').fadeOut(2500); fadeOut_();", 6000);
        })
    }

    function fadeOut_() {
        $('#ticker-area').fadeIn(2000,
        function () {
            setTimeout("$('#ticker-area').fadeOut(2500); fadeIn_();", 6000);
        })
    }

And this is the HTML and CSS inside the text widget:

<div id="flash-rotate"><div id="flash"><object width="560" height="315" type="application/x-shockwave-flash" id="WT1" name="WT1" data="http://elc.imagewize.com/wp-content/uploads/player.swf"><param name="wmode" value="opaque"><param name="allowscriptaccess" value="always"><param name="allownetworking" value="all"><param name="flashvars" value="file=path/to/file.flv&volume=80&bufferlength=5&quality=false&logo.hide=false&image=http%3A%2F%2Fdomain.com%2Fwp-content%2Fuploads%2F2012%2F02%2Fsteve-martin-thumb.png&title=Steve%20Martin%20learning%20English&linktarget=_self"></object>
</div>
<div id="ticker-area">
  <ul>
    <li>Sed venenatis <a href="http://www.google.com">diam quis</a> lorem. Curabitur.</li>
    <li>Fusce <strong>vehicula</strong> iaculis felis. Phasellus congue!</li>
    <li>Morbi vitae enim vel <em>purus sollicitudin</em>.</li>
  </ul>
</div>
</div>

CSS:

#home-top-row .widget_text {margin-top: 50px;}

#ticker-area{
    width:320px;
    height:240px;
    padding: 10px 0;
    margin: 20px 0;
    font-size: 1.5em;
    font-weight: normal;
    color: #060;
}

/*Flash and TickerType*/

#flash-rotate, #text-5{
    width:320px;
    height:240px;
}

Update 5

Tinkered with CSS background and dimensions and now all good!

share|improve this question
1  
You'll need some ajax to overcome this. Or, if you keep them on page load in DOM, then you could track time via js and replace the visibility after x sec. –  kaiser Apr 2 '12 at 14:50
    
Thanks @kaiser I was actually looking for a plugin that already does this one way or another. I can do the basic jQuery stuff which I used for some effects, but to make randomly loaded ads rotate automatically using AJAX or regular JavaScript would be kind of tough. Do you know any plugings WordPress or jQuery that already do this. A textwidget with some HTML and JavaScript could do the trick also I guess.. –  rhand Apr 3 '12 at 6:41
    
OK, got things sort of up and running. See updates. Just had to adjust CSS a bit #ticker-area, #text-5{ width:560px; height:315px; Only now the fading show the video and the tickertype with black background for a short while which is not that nice. So I need some more tinkering. –  rhand Apr 3 '12 at 8:48
    
Tinkering done with CSS. All OK –  rhand Apr 3 '12 at 13:04

1 Answer 1

up vote 1 down vote accepted

All details added to question itself. I use a jQuery plugin to load one div and then another. The script added to question is loaded into the theme by added the following code to functions.php:

function load_home_rotator() {
        wp_enqueue_script('rotator', get_stylesheet_directory_uri() . '/js/rotator.js');
  }
add_action('template_redirect', 'load_home_rotator' );

jQuery itself is loaded by WP so no need to load that. I use fadein and fadeout for effects + setTimeout to rotate these divs that I have added to a WordPress text widget. All running very well now.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.