»
AnglaisFran�aisVietnamien

Imprimer - Clignotant Rich HTML Sticky Conseil - JavaScriptBank.com

Version compl�te: jsB@nk » Framework » jQuery » Clignotant Rich HTML Sticky Conseil
URL: https://www.javascriptbank.com/flashing-rich-html-sticky-board.html

Clignotant Rich HTML Sticky Conseil © JavaScriptBank.comClignotant Rich HTML Sticky Board - un instrument utile et pratique du code JavaScript pour faire pivoter votre importantes nouvelles (ou avis) sur votre site web, avec effets de la décoloration   et figurant sur la disparition. Le contenu peut être défini sur la même page Web, ou peut être obtenu à partir d'autres pages via La technologie AJAX, Le script utilise aussi cookie   pour stocker le dernier message que l'utilisateur a cliqué.

Version compl�te: jsB@nk » Framework » jQuery » Clignotant Rich HTML Sticky Conseil
URL: https://www.javascriptbank.com/flashing-rich-html-sticky-board.html



CSS
<style type="text/css">.tickerstyle{width:200px; height:180px; border:1px solid black; background:lightyellow; padding:8px; overflow:hidden;}.messagediv{display: none;background:lightyellow}</style>


JavaScript
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script><script type="text/javascript" name="richhtmlticker.js">/************************************************ Rich HTML Ticker- by JavaScript Kit (www.javascriptkit.com)* This notice must stay intact for usage* Visit JavaScript Kit at http://www.javascriptkit.com/ for full source code***********************************************//** Rich HTML Ticker- by JavaScript Kit (http://www.javascriptkit.com)* Freeware. Created Sept 13th, 08'* This credit must stay intact for use*/var richhtmlticker={loadingtext: '<em>Fetching Ticker Contents. Please wait...</em>', //Loading text if content is being fetched via Ajaxgetajaxcontent:function($, config){config.$ticker.html(this.loadingtext)$.ajax({url: config.msgsource,error:function(ajaxrequest){config.$ticker.html('Error fetching content.<br />Server Response: '+ajaxrequest.responseText)},success:function(content){config.$ticker.html(content)richhtmlticker.setupticker(config)}})},rotate:function(config){if (config.$ticker.get(0)._hoverstate=="over"){setTimeout(function(){richhtmlticker.rotate(config)}, config.rotatespeed)}else{config.$messages.eq(config.currentmsg).fadeOut(config.animateduration, function(){config.currentmsg=(config.currentmsg<config.$messages.length-1)? config.currentmsg+1 : 0config.$messages.eq(config.currentmsg).fadeIn(config.animateduration, function(){setTimeout(function(){richhtmlticker.rotate(config)}, config.rotatespeed)})})}},getCookie:function(Name){ var re=new RegExp(Name+"=[^;]+", "i") //construct RE to search for target name/value pairif (document.cookie.match(re)) //if cookie foundreturn document.cookie.match(re)[0].split("=")[1] //return its valuereturn null},setCookie:function(name, value){document.cookie = name+"="+value},setupticker:function(config){config.$messages=config.$ticker.find('div.'+config.msgclass).hide()config.currentmsg=Math.min(parseInt(richhtmlticker.getCookie(config.id) || 0), config.$messages.length-1)config.$messages.hide().eq(config.currentmsg).fadeIn(config.animateduration)setTimeout(function(){richhtmlticker.rotate(config)}, config.rotatespeed)$(window).bind('unload', function(){richhtmlticker.cleanup(config)})},define:function(config){  jQuery(document).ready(function($){config.$ticker=$('#'+config.id)if (config.$ticker.length==0)returnconfig.$ticker.css({overflow:'hidden'}).hover(function(){this._hoverstate="over"},function(){this._hoverstate="out"})if (config.msgsource=="inline"){richhtmlticker.setupticker(config)}else{richhtmlticker.getajaxcontent($,config)}})},cleanup:function(config){this.setCookie(config.id, config.currentmsg)}} //end richhtmlticker object//////////// Declare instance of Rich HTML Ticker (invoked when page has loaded): ///////////////////////////richhtmlticker.define({id: "myhtmlticker", //main ticker DIV idmsgclass: "messagediv", //CSS class of DIVs containing each ticker messagemsgsource: "inline", //Where to look for the messages: "inline", or "path_to_file_on_your_server"rotatespeed: 3000, //pause in milliseconds between rotationanimateduration: 1000 //duration of fade animation in milliseconds })/*     This script downloaded from www.JavaScriptBank.com     Come to view and download over 2000+ free javascript at www.JavaScriptBank.com*/</script>


HTML
<div id="myhtmlticker" class="tickerstyle"><div class="messagediv"><b><a href="/loan-payment-calculator.html/en/">Loan Payment Calculator</a></b><br />A <a href="/javascript/">JavaScript</a> <a href="/javascript/calculation/calculator/">calculator code</a> that calculates your monthly loan payment.</div><div class="messagediv"><b><a href="/epoch-dhtml-calendar-index.html/en/">Epoch DHTML Calendar</a></b><br />Epoch is a flexible DHTML calendar that supports several display formats, such as inline on the page, as a DHTML date picker, or an calendar that with the ability to select multiple dates. Best of all, it's released under the GNU Lesser General Public License, so you can use and distribute this calendar for free inside your web pages and applications.</div><div class="messagediv"><b><a href="/newsscroller.html/en/">NewsScroller</a></b><br />A pausing <a href="/javascript/scroller/">news scroller</a>. Easy to implement, highly configurable, and hyperlink capable.</div><div class="messagediv"><b><a href="/robots-text-generator.html/en/">Robots Text Generator</a></b><br />This <a href="/javascript/utility/generator/">generator</a> creates the meta tag for robots. It also includes the code for the Googlebot.</div><div class="messagediv"><b><a href="/blur-name-typer.html/en/">Blur name Typer</a></b><br />This is a very stylish <a href="/title=DHTML">DHTML</a> ticker with an eyecatching blur effect by asking visitors type string to display.</div></div>


Files
http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js