Webseite JahoART

jahoART
  • joomlaos.de
  • joomlajobs.de
Notice: Undefined variable: bnum in /srv/www/vhosts/jahoart.eu/httpdocs/plugins/content/mmp3.php on line 1781 Notice: Undefined variable: bnum in /srv/www/vhosts/jahoart.eu/httpdocs/plugins/content/mmp3.php on line 1781 Notice: Undefined variable: bnum in /srv/www/vhosts/jahoart.eu/httpdocs/plugins/content/mmp3.php on line 1781 Notice: Undefined variable: bnum in /srv/www/vhosts/jahoart.eu/httpdocs/plugins/content/mmp3.php on line 1781

Player Control - jQuery (Mini-MP3-Player)

Available in jahoart-suite.gif

The links can be arbitrarily customized with JQuery.

Before you can begin working with jQuery: If jQuery library not in index.php already loaded, you must enable jQuery library in the Plugin Parameters.

Default CSS classes:

  • Start: audioplay
  • Pause: audiopause
  • Stop: audiostop
  • Continue: audiomore

Demo:

Use the player hide.swf.

optional parameters: jsnav=1, class=demojs1 (see Overview optional parameters).

XHTML {mmp3}hide.swf|any.mp3&jsnav=1&class=demojs1{/mmp3}

Images for the Buttons:
Playbutton Pausebutton Stopbutton Morebutton

Add a new set of <script> tags (or attach a new Javascript file) to the <head> of the index.php.

Demo 1 Javascript file

Source attach a new Javascript<script type="text/javascript" src="/Your Path/mmpdemo.js"></script> Source add <script> <script type="text/javascript">
jQuery.noConflict();
    (function($) {
        $(document).ready( function() {
        var demo1 = '.demojs1';
        var btnplay ='<img src="/Your Path/button-play.png" alt="Play" />';
        var btnpause ='<img src="/Your Path/button-pause.png" alt="Pause" />';
        var btnstop ='<img src="/Your Path/button-stop.png" alt="Stop" />';
        var btncontinue ='<img src="/Your Path/button-ct-en.png" alt="More" />';

        $(demo1+' a.audioplay').html(btnplay);
        $(demo1+' a.audiopause').html(btnpause);
        $(demo1+' a.audiostop').html(btnstop);
        $(demo1+' a.audiomore').html(btncontinue);

        $(demo1+' a.audioplay').click(function () {
            $(demo1+' a.audioplay').html(btnplay);
            $(demo1+' a.audiopause').html(btnpause);
            $(demo1+' a.audiomore').html(btncontinue);
        });

        $(demo1+' a.audiostop').click(function () {
            $(demo1+' a.audioplay').html(btnplay);
        });
    });
})(jQuery);
</script>

Demo:

    • Use the player hide.swf.

    optional parameters: jsnav=1, class=demojs2 (see Overview optional parameters).

    XHTML {mmp3}hide.swf|any1.mp3&jsnav=1&class=demojs2{/mmp3}
    {mmp3}hide.swf|any2.mp3&jsnav=1&class=demojs2{/mmp3}

    Images for the Buttons:
    Playbutton Stopbutton

    Add a new set of <script> tags (or attach a new Javascript file) to the <head> of the index.php.

    Demo 2 Javascript file

    Source attach a new Javascript <script type="text/javascript" src="/Your Path/mmpdemo2.js"></script> Source add <script> <script type="text/javascript">
    jQuery.noConflict();
        (function($) {
            $(document).ready( function() {
            var demo2 = '.demojs2 a';
            var btnplay2 ='<img src="/Your Path/button-red-play.png" alt="Play" />';
            var btnstop2 ='<img src="/Your Path/button-red-stop.png" alt="Stop" />';
            $(demo2+'.audioplay').html(btnplay2);
            $(demo2+'.audiostop').html(btnstop2);
            $(demo2+'.audiostop').hide();
            $(demo2+'.audioplay').click(function () {
                var e = this.rel;
                $(demo2+'.audiostop').hide();
                $(demo2+'.audioplay').html(btnplay2).show();
                $('a#start'+ e).hide();
                $('a#stop'+ e).html(btnstop2).show();
            });

            $(demo2+'.audiostop').click(function () {
                $(demo2+'.audiostop').hide();
                $(demo2+'.audioplay').html(btnplay2).show();
            });
        });
     })(jQuery);

    </script>

Demo:

Use the player hide.swf.

optional parameters: jsnav=1, class=demojs3 (see Overview optional parameters).

XHTML {mmp3}hide.swf|any1.mp3&jsnav=1&class=demojs3{/mmp3}
<div id="demo3" style="display: none;">
<blockquote>Tot de groep blokfluiten behoren sopraan, alt, tenor en bas. Met blokfluit spelen kan je al op jonge leeftijd starten, maar ook voor volwassenen biedt het instrument vele mogelijkheden middels het brede repertoire. Mede met het oog op samenspel krijgen de leerlingen alle bekende typen blokfluit te bespelen. <cite><a href="http://www.cqcentrumvoordekunsten.nl">CQ CENTRUM VOOR DE KUNSTEN</a></cite></blockquote>
</div>

Images for the Buttons:
Playbutton Stopbutton

Add a new set of <script> tags (or attach a new Javascript file) to the <head> of the index.php.

Demo 3 Javascript file

Source attach a new Javascript <script type="text/javascript" src="/Your Path/mmpdemo3.js"></script> Source add <script> <script type="text/javascript">
jQuery.noConflict();
    (function($) {
        $(document).ready( function() {
        var demo3 = '.demojs3 a';
        var demo3div = '#demo3';
        var btnplay3 ='<img src="/Your Path/btn-start.png" alt="Play" />';
        var btnstop3 ='<img src="/Your Path/btn-stop.png" alt="Stop" />';
       
        $(demo3+'.audioplay').html(btnplay3);
        $(demo3+'.audiostop').html(btnstop3).hide();
       
        $(demo3+'.audioplay').click(function () {
        var e = this.rel;
            $(demo3+'.audiostop').hide();
            $(demo3+'.audioplay').html(btnplay3).show();
            $('a#start'+ e).hide();
            $(demo3div).fadeIn("slow");
            $('a#stop'+ e).html(btnstop3).show();
        });
       
        $(demo3+'.audiostop').click(function () {
            $(demo3+'.audiostop').hide();
            $(demo3div).fadeOut("slow");
            $(demo3+'.audioplay').html(btnplay3).show();
        });           
    });
})(jQuery);
</script>

go top