« »

L'ACC pouvoirs @ nk tiens ? dire dans ce scroller texte JavaScript JavaScript sont des comp?tences POO, ce afficheur de nouvelles JavaScript script est cod? dans les technologies de programmation orient?e objet JavaScript avec une documentation d?taill?e compl?te/instructions
changeurs web JavaScript que vous voulez avec des blocs illimit? de HTML, et d'ailleurs, vous ?tes en mesure de modifier les options de d?filement facilement, tels que: la vitesse, les positions, temps de retard, etc pour chaque scroller div Le script va ?galement mettre en pause le passage de la souris, et reprendre le d?filement sur mouseout Depuis il d?file HTML au lieu de simplement changeurs de l'image, Vous pouvez inclure ? peu pr?s tout ce qui peut ?tre normalement plac? dans un document HTML statique: liens, images, graphiques, tableaux, d?cors, etc

ï¿½tiquette: scroller texte JavaScript, afficheur de nouvelles JavaScript, scroller web JavaScript, scroller div, scroller image, d?filement vertical JavaScript, d?filement du texte JavaScript

Rapport de nous cette erreur JavaScript

Demo
Agrandir
Recharger
New window

Gratuit iPage hï¿½bergement Web pour la premiï¿½re annï¿½e MOMENT

Si vous ï¿½tes toujours ï¿½ la recherche d'un fournisseur d'hï¿½bergement Web fiable avec des tarifs abordables, pourquoi vous ne prenez pas un peu de temps pour essayer iPage, seulement avec $1.89/month, inclus $500+ Crï¿½dits supplï¿½mentaires gratuites pour le paiement de 24 mois ($45)?

Plus de 1.000.000 de clients + existisng peuvent pas avoir tort, vraiment vous n'ï¿½tes pas aussi! Plus important encore, lorsque vous enregistrez l'hï¿½bergement web ï¿½ iPage grï¿½ce ï¿½ notre lien, nous allons ï¿½tre heureux de renvoyer un plein remboursement. C'est gï¿½nial! Vous devriez essayer iPage hï¿½bergement web GRATUITEMENT maintenant! Et contactez-nous pour tout ce que vous devez savoir sur iPage. Essayez iPage GRATUIT premiï¿½re annï¿½e MOMENT

Code
CSS
JavaScript
HTML
Imprimer

Copy All x2

<style type="text/css">
 #scr1 div {
  visibility:hidden;
 }
 #scr1, #scr1 div.default {
   width:160px;
   height:120px;
   overflow:hidden;
   visibility:visible;
 }
 #scr1 table tr td div {
  visibility:visible;
 }

 #scr1 {
   background-color:#fff;
   margin:0px auto;
   font-size: .8em;
 }

</style>

Copy All x2

<script type="text/javascript">
// Created by: Brian Huisman | http://www.greywyvern.com/
// This script downloaded from www.JavaScriptBank.com

/* ********************************************************************
* HTML Block Scroller & Marquee JavaScript - v2.0
*  - Copyright 2008 - Licenced for free distribution under the BSDL
*  -     http://www.opensource.org/licenses/bsd-license.php
*
* Have one or more scrolling blocks of HTML anywhere on your webpages.
* The scroller will even pause on mouseover and resume on mouseout.
*
* Version 2.0
*   - Uses DOM-only methods (compatible with application/xhtml+xml)
*   - Blocks are created in the HTML page, rather than as JS variables
*   - Automatic startup on page load

***********************************************************************
*** Instructions ******************************************************
***********************************************************************
* 1. Create the container for the scroller in the body of your HTML:
*
* <div id="scr1"></div>
*
* Where "scr1" is any name you choose.  You don't have to use a <div>
* either.  You may use any block level element that can be pixel
* resized; such as a <span> element to which the display:block; CSS
* property has been applied.
*
***********************************************************************
* 2. Fill the scroller container with child <div> blocks:
*
* <div id="scr1">
*   <div class="default">
*     The contents of this block will be displayed if the browser does
*     not support the scroller.
*     It will be overwritten if the scroller is supported.
*   </div>
*   <div>Block 2</div>
*   <div>Block 3</div>
*
*   ...
*
* </div>
*
* Assign the class "default" to the first block, the one which you
* would like displayed if javascript is disabled.
*
***********************************************************************
* 3. Add the following rule(s) to your CSS stylesheet:
*
* #scr1 div {
*  visibility:hidden;
* }
* #scr1, #scr1 div.default {
*   width:160px;
*   height:120px;
*   overflow:hidden;
*   visibility:visible;
* }
* #scr1 table tr td div {
*  visibility:visible;
* }
*
* Change both "scr1" to the id you gave to the scroller container.  The
* width and height properties should match those you will use in step 4.
*
* To further style the scroller container, assign CSS properties to the
* scroller target id:
*
* #scr1 {
*   background-color:#f6f6f6;
*   margin:0px auto;
* }
*
* The script will replace each block you add to the container with a
* single-celled <table>. So to style the blocks of your scroller, you
* can style these table cells as if they were actually part of your
* document source:
*
* #scr1 table tr td {
*   padding:10px;
*   color:#ff0000;
*   text-align:center;
*   vertical-align:middle;
* }
*
***********************************************************************
* 4. Create a new scrollObject:
*
* new scrollObject("scr1", 120, 120, "up", 5000, 1.4);
*
* The arguments for this object are as follows:
*  a. - ID of the target tag (from step 1)
*  b. - Width (in pixels) of your scroller
*  c. - Height (in pixels) of your scroller
*  d. - Scroll direction: one of "up", "down", "left" or "right"
*  e. - Amount of time to pause before next scroll begins (ms)
*  f. - Slide-in speed of your scroller (1.001 up to width or height)
*
***********************************************************************
*** To add more scrollers to the same page: ***************************
***********************************************************************
* 1. Create additional containers - with different ID's - and blocks in
*    the body of your HTML
*
* <div id="scr2">
*   <div class="default"><strong>HTML is allowed too!</strong></div>
*   <div><img src="/images/mybanner.jpg" alt=""></div>
*   <div><a href="/home">And links!</a></div>
*   <div>As long as it fits within the dimensions above</div>
* </div>
*
* <div id="scr3">
*   <div class="default">Block 1</div>
*   <div>Block 2</div>
*   <div>Block 3</div>
*   <div>Block 4</div>
* </div>
*
***********************************************************************
* 2. Add the matching rules to your CSS stylesheet
*
* #scr2 div,
* #scr3 div {
*  visibility:hidden;
* }
* #scr2, #scr2 div.default {
*   width:468px;
*   height:60px;
*   overflow:hidden;
*   visibility:visible;
* }
* #scr3, #scr3 div.default {
*   width:140px;
*   height:140px;
*   overflow:hidden;
*   visibility:visible;
* }
* #scr2 table tr td div,
* #scr3 table tr td div {
*  visibility:visible;
* }
*
***********************************************************************
* 3. Create new scrollObjects for each scroller in the <script> tag:
*
* new scrollObject("scr2", 468, 60, "down", 10000, 1.2);
* new scrollObject("scr3", 140, 140, "right", 4000, 2);
*
***********************************************************************
*** End Instructions **************************************************
*************************************************** BEGIN CODE ***** */



/* *****
 * See http://www.greywyvern.com/code/js/scroller.html for the page
 * which uses the example scrollers below
 *
 */


// ***** Start scroller #1
new scrollObject("scr1", 160, 120, "up", 5000, 1.15);

// ***** Start scroller #2
new scrollObject("scr2", 468, 60, "left", 3000, 1.5);




/* ********************************************************************
 * The Mighty ScrollObject
 *   - Don't edit this if you know what's good for ya!
 *
 */
function scrollObject(main, width, height, direct, pause, speed) {
  var self = this;
  this.main = main;
  this.width = width;
  this.height = height;
  this.direct = direct;
  this.pause = pause;
  this.speed = Math.max(1.001, Math.min((direct == "up" || direct == "down") ? height : width, speed));
  this.slope = (direct == "up" || direct == "left") ? 1 : -1;
  this.prev = this.offset = 0;
  this.curr = 1;
  this.mouse = false;
  this.scroll = function() {
    this.main = document.getElementById(this.main);
    this.main.style.overflow = "hidden";
    this.main.style.position = "relative";
    this.main.style.width = this.width + "px";
    this.main.style.height = this.height + "px";
    var b = [], c;
    while (this.main.firstChild) if ((c = this.main.removeChild(this.main.firstChild)).nodeName == "DIV") b.push(c);
    for (var x = 0; x < b.length; x++) {
      var table = document.createElement('table');
          table.cellPadding = table.cellSpacing = table.border = "0";
          table.style.position = "absolute";
          table.style.left = table.style.top = "0px";
          table.style.width = table.style.height = "100%";
          table.style.overflow = table.style.visibility = "hidden";
        var tbody = document.createElement('tbody');
          var tr = document.createElement('tr');
            var td = document.createElement('td');
              while (b[x].firstChild)
                  td.appendChild(b[x].removeChild(b[x].firstChild));
              tr.appendChild(td);
            tbody.appendChild(tr);
          table.appendChild(tbody);
      this.main.appendChild(table);
    } b = c = null;
    if (this.main.childNodes.length > 1) {
      this.main.onmouseover = function() { self.mouse = true; };
      this.main.onmouseout = function() { self.mouse = false; };
      setInterval(function() {
        if (!self.offset && self.scrollLoop()) self.main.childNodes[self.curr].style.visibility = "visible";
      }, this.pause);
    } this.main.childNodes[this.prev].style.visibility = "visible";
  };
  this.scrollLoop = function() {
    if (!this.offset) {
      if (this.mouse) return false;
      this.offset = (this.direct == "up" || this.direct == "down") ? this.height : this.width;
    } else this.offset = Math.floor(this.offset / this.speed);
    if (this.direct == "up" || this.direct == "down") {
      this.main.childNodes[this.curr].style.top = (this.offset * this.slope) + "px";
      this.main.childNodes[this.prev].style.top = ((this.offset - this.height) * this.slope) + "px";
    } else {
      this.main.childNodes[this.curr].style.left = (this.offset * this.slope) + "px";
      this.main.childNodes[this.prev].style.left = ((this.offset - this.width) * this.slope) + "px";
    }
    if (!this.offset) {
      this.main.childNodes[this.prev].style.visibility = "hidden";
      this.prev = this.curr;
      if (++this.curr >= this.main.childNodes.length) this.curr = 0;
    } else setTimeout(function() { self.scrollLoop(); }, 30);
    return true;
  };
  if (window.addEventListener) {
    window.addEventListener('load', function() { self.scroll(); }, false); 
  } else if (window.attachEvent)
    window.attachEvent('onload', function() { self.scroll(); });
}
</script>

Copy All x2

<div id="scr1">

<div class="default"><i>The JavaScript Bank</i> is an excellent JavaScript resource.</div>
<div><b>Want some recognition for your scripts?</b><br><a href="http://javascriptbank.com/submit/">Submit them to us</a> and they can be featured on JavaScript Source!</div>
<div>Three times a week we add a new script or tutorial to our archives.</div>

</div>

Commentaire (6)
ï¿½crire

par write my essay, 17/03/2011 05:03 PM
Thanks Rï¿½ponse

Good, really good site about html. Your blog is very useful, I think I would follow you in future. Thanks

par Cao Phong, 17/03/2011 08:03 PM
Rï¿½ponse

oh no, don't need to wait till tomorrow, follow me on <url="http://www.twitter.com/js_bank">twitter</url> & <url="http://www.facebook.com/jsbank">facebook</url> NOW for free

par son0nline, 22/03/2011 09:03 AM
thank Rï¿½ponse

thank
how to display more news?

par Cao Phong, 22/03/2011 02:03 PM
can you explain? @ son0nline Rï¿½ponse

I don't understand what you're wanting? you're wanting to show more than 1 item in the same time? or setup more than 1 scoller? or what?

par son0nline, 25/03/2011 01:03 AM
yes @ Cao Phong Rï¿½ponse

yes I want to show more than 1 item in the same time.

like: news 1, news 2, news 3,
and then: news 2, news 3, news 4,

par Cao Phong, 25/03/2011 06:03 PM
@ son0nline Rï¿½ponse

hi

really the core-JavaScript of this code designed for showing 1 item per session; it doesn't have any setting to show more 1 item

so I think you should try another alternations on jsB@nk; or you can use jQuery+vTicker; I'm using this for <url="http://www.danhngon.info">DanhNgon.info</url> and I see it's so good >

par Avant-premiï¿½re

Annuler rï¿½ponse

ï¿½crivez votre commentaire

Commentaires du client sera publiï¿½ avant previwed
Donnez votre email rï¿½el pour obtenir des rï¿½ponses notification ou commentaire sera supprimï¿½

Votre nom *
Votre e-mail^g *
~~Votre site~~

Comment's Titre

J'assure ï¿½ 100% je suis humain rï¿½el
Je le rï¿½pï¿½te, je ne suis pas bot

Sent (0)
Nouveau

BBCode
HTML
URL
JID

AIVideo-App.com
GÃ©nÃ©rez vos vidÃ©os d'entreprise par l'IA avec la voix ou simplement du texte

chatGPTaz.com
Parlez Ã ChatGPT dans votre langue maternelle

AppAIVidÃ©o
Votre premiÃ¨re application vidÃ©o AI GRATUITE

Deepfake Video
Deepfake AI Video Maker

Deepfake
Deepfake AI Video Maker

AI Deep Fake
Deepfake AI Video Maker

AIvidio
AI Video Mobile Solutions

AIvideos
AI Video Platform & Solutions

AIvedio
AI Video App Maker

Faceswap AI en ligne
Ã‰changez des visages, des vidÃ©os, des photos et des GIF instantanÃ©ment avec de puissants outils d'IA - Faceswap AI Online GRATUIT

Faceswap AI en ligne
Ã‰changez des visages, des vidÃ©os, des photos et des GIF instantanÃ©ment avec de puissants outils d'IA - Faceswap AI Online GRATUIT

Temu gratuit 500 $ pour les nouveaux utilisateurs
Claim Free Temu $500 Credit via Affiliate & Influencer Program

CrÃ©dits publicitaires TikTok gratuits
MaÃ®trisez les publicitÃ©s TikTok pour le marketing de votre entreprise

Dall-E-OpenAI.com
GÃ©nÃ©rez automatiquement des images crÃ©atives avec l'IA

chatGPT4.win
Parlez Ã ChatGPT dans votre langue maternelle

Premier produit d'intelligence artificielle d'Elon Musk - Grok/UN.com
Parlez au chatbot Grok AI dans votre langue

Outily.win
Centre d'outils ouvert et gratuit, utilisable par tous et pour tous, avec des centaines d'outils

GateIO.gomymobi.com
Airdrops gratuits Ã rÃ©clamer et Ã partager jusqu'Ã 150 000 $ par projet

iPhoneKer.com
Ã‰conomisez jusqu'Ã 630 $ Ã l'achat d'un nouvel iPhone 16

Acheter le robot Tesla Optimus
Commandez votre robot Tesla Bot : Optimus Gen 2 dÃ¨s aujourd'hui pour moins de 20 000 $

Cool Domains for Sale!

system.money gomy.mobi chatGPT2.fun javascriptON.com AIvideo-app.com XMQV.com ApexBTC.com CryptoKD.com ABP3.com lend.services GrokUN.com eChainBank.com chatGPT4.win Dall-E-OpenAI.com CreditCard.rip pornID.net CTRCoin.com gomy.mobi chatGPTaz.com hearf.com ChatTotal.com JavaScriptBank.com gomymobi.com ZWVQ.com gomymobi.com war.money MetaTru.com index.services AI-Trading-Bot.com Card.rip ChainTutor.com

Dï¿½poser jours:
Auteur:
Previews:
Commentaire:
Votes:
Sent:
Taille:
Rang:

14/03/2011
Brian Huisman [more]
9,971
6
31
0
12.38 KBytes

POO JavaScript puissant pour Scroller HTML - Langue: Franï¿½aise

4/5 31 votes / 9,971 previews / 6 commentaire 14/03/2011 L'ACC pouvoirs @ nk tiens ? dire dans ce scroller texte JavaScript JavaScript s...POO JavaScript puissant pour Scroller HTML - POO JavaScript puissant pour Scroller HTML - Langue: Franï¿½aise

beheogioivo zerokenda[2] Killer.VnGeneral babe1907 RAO247.VN xx3004 Cao Phong[7]