2010-11-04 43 views
2

Je veux placer un rectangle de défilement dans ma balise de titre html en utilisant jquery mais je ne sais pas comment et ne peux pas trouver une bonne explication en ligne n'importe où. Quelqu'un peut-il m'aider s'il vous plaît?jQuery défilement dans la balise de titre de la page html

+0

Il parle de la balise HTML ... pas une <marquee> réelle étiqueter ni bouger réellement de gauche ou de droite. Il parle de la façon dont les balises de titre HTML semblent se déplacer vers la gauche ou la droite en supprimant et en ajoutant des caractères au <title>. – <span class="text-secondary"> <small> <span></span> </small> </span> </p> </div> </div> </div> <div itemprop="comment" class="post-comment"> <div class="row"> <div class="col-lg-1"><span class="text-secondary">+0</span></div> <div class="col-lg-11"> <p class="commenttext">Sur une autre note @sadmicrowave pourquoi au nom de Dieu voudriez-vous faire cela? – <span class="text-secondary"> <small> <span></span> </small> </span> </p> </div> </div> </div> <div itemprop="comment" class="post-comment"> <div class="row"> <div class="col-lg-1"><span class="text-secondary">+0</span></div> <div class="col-lg-11"> <p class="commenttext">hahaha, ok, de toute façon ... y at-il un moyen d'empêcher les réponses qui auraient été demandées dans les jours de guerre du navigateur;) – <span class="text-secondary"> <small> <span></span> </small> </span> </p> </div> </div> </div> </div> </div> </article> </div> <div class="answer-title"> <span class="text-logo margin-top-sm">A</span> <h2 class="title h4">Répondre</h2> </div> <div class="item-description text-md markdown-body margin-bottom-40 voidso"> <article class="board-top-1 padding-top-10"> <div class="post-col vote-info"> <span class="count">9<i class="fa fa-thumbs-up"></i></span> <i class="fa fa-check fa-2x"></i> </div> <div class="post-offset"> <div class="answer fmt"> <p>Ce n'est pas très difficile à faire si vous voulez juste pour faire défiler comme la balise <code class="prettyprint-override">marquee</code>:</p> <pre><code class="prettyprint-override">(function titleMarquee() { document.title = document.title.substring(1)+document.title.substring(0,1); setTimeout(titleMarquee, 200); })(); </code></pre> <p>C'est assez basique, mais devrait vous donner une idée sur la façon de modifier à votre goût.</p> </div> <div class="post-info"> <div class="post-meta row"> <p class="text-secondary col-lg-6"> <span class="source"> <a rel="noopener" target="_blank" href="https://stackoverflow.com/q/4099088">Source</a> </span> </p> <p class="text-secondary col-lg-6"> <span class="float-right date"> <span>2010-11-04 16:51:39</span> </p> <p class="col-12"></p> <p class="col-12"></p></div> </div> <!-- comments --> <div class="comments"> <div itemprop="comment" class="post-comment"> <div class="row"> <div class="col-lg-1"><span class="text-secondary">+1</span></div> <div class="col-lg-11"> <p class="commenttext">Merci pour le code .. cela fonctionne bien, sauf pour un attelage. Après le premier défilement, pour une raison quelconque, tous les espaces sont supprimés et les mots sont croqués les uns à côté des autres. Comment puis-je préserver les espaces? Merci, Phil – <span class="text-secondary"> <small> <a rel="noopener" target="_blank" href="https://stackoverflow.com/users/628596/">psarid</a></span> <span></span> </small> </span> </p> </div> </div> </div> <div itemprop="comment" class="post-comment"> <div class="row"> <div class="col-lg-1"><span class="text-secondary">+0</span></div> <div class="col-lg-11"> <p class="commenttext">@psarid J'ai posté une réponse pour résoudre ce problème. – <span class="text-secondary"> <small> <a rel="noopener" target="_blank" href="https://stackoverflow.com/users/618279/">sedran</a></span> <span></span> </small> </span> </p> </div> </div> </div> </div> </div> </article> <div> <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-6208739752673518" data-ad-slot="1038284119" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> <article class="board-top-1 padding-top-10"> <div class="post-col vote-info"> <span class="count">4<i class="fa fa-thumbs-up"></i></span> </div> <div class="post-offset"> <div class="answer fmt"> <p>Dans la réponse de Tatu Ulmanen, il y a un problème avec les caractères d'espace. Comme psarid indiqué comme commentaire, après le premier parchemin, tous les espaces sont supprimés.</p> <p>Ceci est dû au fait que l'analyseur html coupe les textes. Cela signifie qu'il supprime les espaces à la fin et au début du texte. Lorsque le titre défile, l'objet de titre en HTML ressemble à ça:</p> <pre><code class="prettyprint-override"><title>Scrolling Title With Spaces</title> <title>crolling Title With SpacesS</title> <title>rolling Title With SpacesSc</title> <title>olling Title With SpacesScr</title> ... <title>Title With SpacesScrolling</title> </code></pre> <p>Comme vous pouvez le voir ci-dessus, nous avons perdu l'espace entre les mots <code class="prettyprint-override">Scrolling</code> et <code class="prettyprint-override">Spaces</code>. Pour éviter cela, nous devons stocker l'original <code class="prettyprint-override">document.title</code> quelque part dans notre code javascript et mettre un espace ou quelque chose d'autre à la fin de celui-ci. Ensuite, nous pouvons faire défiler <code class="prettyprint-override">document.title</code> en faisant défiler le texte dans l'autre variable. Voici le code modifié de Tatu Ulmanen.</p> <pre><code class="prettyprint-override">var documentTitle = document.title + " - "; (function titleMarquee() { document.title = documentTitle = documentTitle.substring(1) + documentTitle.substring(0,1); setTimeout(titleMarquee, 200); })(); </code></pre> </div> <div class="post-info"> <div class="post-meta row"> <p class="text-secondary col-lg-6"> <span class="source"> <a rel="noopener" target="_blank" href="https://stackoverflow.com/q/19724640">Source</a> </span> </p> <p class="text-secondary col-lg-6"> <span class="float-right date"> <span>2013-11-01 10:10:05</span> <a rel="noopener" target="_blank" href="https://stackoverflow.com/users/618279/">sedran</a></span> </p> <p class="col-12"></p> <p class="col-12"></p></div> </div> </div> </article> <article class="board-top-1 padding-top-10"> <div class="post-col vote-info"> <span class="count">0<i class="fa fa-thumbs-up"></i></span> </div> <div class="post-offset"> <div class="answer fmt"> <p>Ajoutez le script ci-dessous sur la tête de page, puis appeler les scrlsts() fonction sur le corps onload</p> <pre><code class="prettyprint-override"><script type="text/javascript"> var scrl = $('title').text(); function scrlsts() { scrl = scrl.substring(1, scrl.length) + scrl.substring(0, 1); document.title = scrl; setTimeout("scrlsts()", 500); } <script> </code></pre> <p></p> </div> <div class="post-info"> <div class="post-meta row"> <p class="text-secondary col-lg-6"> <span class="source"> <a rel="noopener" target="_blank" href="https://stackoverflow.com/q/27294385">Source</a> </span> </p> <p class="text-secondary col-lg-6"> <span class="float-right date"> <span>2014-12-04 12:42:35</span> </p> <p class="col-12"></p> <p class="col-12"></p></div> </div> </div> </article> </div> <div class="clearfix"> </div> <div> <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-6208739752673518" data-ad-slot="1575177025"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> <div class="padding-top-10"></div> </div> </div> <script type="text/javascript" src="http://img.uwenku.com/uwenku/script/side.js?t=1644592048548"></script> <script type="text/javascript" src="http://img.uwenku.com/uwenku/plugin/highlight/highlight.pack.js"></script> <link href="http://img.uwenku.com/uwenku/plugin/highlight/styles/docco.css" media="screen" rel="stylesheet" type="text/css" /> <script type="text/javascript"> $('pre').each(function(i, e) { hljs.highlightBlock(e, "<span class='indent'> </span>", false) }); </script> <div class="col-lg-3 col-md-4 col-sm-5"> <div id="rightTop"> <div class="row"> <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-6208739752673518" data-ad-slot="5415218910" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> <div class="row sidebar panel panel-default"> <div class="panel-heading font-bold"> Dernière question </div> <div class="m-b-sm m-t-sm clearfix"> <ul class="side_article_list"> <li class="side_article_list_item"> 1. <a href="http://fr.uwenku.com/question/p-vycycbbs-b.html" target="_blank" title="PHP - éléments preg_replace entre parenthèses avec des éléments du tableau"> PHP - éléments preg_replace entre parenthèses avec des éléments du tableau </a> </li> <li class="side_article_list_item"> 2. <a href="http://fr.uwenku.com/question/p-zqjqwnlb-e.html" target="_blank" title="par rapport joint corrélative existe des sous-requêtes"> par rapport joint corrélative existe des sous-requêtes </a> </li> <li class="side_article_list_item"> 3. <a href="http://fr.uwenku.com/question/p-zhqbcukb-n.html" target="_blank" title="Html.EditorFor additionalViewData"> Html.EditorFor additionalViewData </a> </li> <li class="side_article_list_item"> 4. <a href="http://fr.uwenku.com/question/p-xbpixaha-p.html" target="_blank" title="Accès manquant aux attributs importants pour CTP5"> Accès manquant aux attributs importants pour CTP5 </a> </li> <li class="side_article_list_item"> 5. <a href="http://fr.uwenku.com/question/p-ndydmlsx-o.html" target="_blank" title="Prototype JavaScript Ajax FIFO Queue"> Prototype JavaScript Ajax FIFO Queue </a> </li> <li class="side_article_list_item"> 6. <a href="http://fr.uwenku.com/question/p-ewprqjko-b.html" target="_blank" title="Comment limiter le nombre de résultats obtenus?"> Comment limiter le nombre de résultats obtenus? </a> </li> <li class="side_article_list_item"> 7. <a href="http://fr.uwenku.com/question/p-dsavfoyr-a.html" target="_blank" title="jquery ui sélectionnable combiné avec des œuvres draggables dans IE mais pas dans Firefox"> jquery ui sélectionnable combiné avec des œuvres draggables dans IE mais pas dans Firefox </a> </li> <li class="side_article_list_item"> 8. <a href="http://fr.uwenku.com/question/p-hmsalbbs-d.html" target="_blank" title="Comment faire référence à la fonction MIN SQL dans ma clause WHERE à l'aide d'une sous-table?"> Comment faire référence à la fonction MIN SQL dans ma clause WHERE à l'aide d'une sous-table? </a> </li> <li class="side_article_list_item"> 9. <a href="http://fr.uwenku.com/question/p-hbpoyeok-cm.html" target="_blank" title="Pourquoi ReadProcessMemory a-t-il `lpNumberOfBytesRead`?"> Pourquoi ReadProcessMemory a-t-il `lpNumberOfBytesRead`? </a> </li> <li class="side_article_list_item"> 10. <a href="http://fr.uwenku.com/question/p-zukvtnaa-ck.html" target="_blank" title="Interrogation longue verrouillant d'autres appels AJAX"> Interrogation longue verrouillant d'autres appels AJAX </a> </li> </ul> </div> </div> </div> <p class="article-nav-bar"></p> <div class="row sidebar article-nav"> <div class="row box_white visible-sm visible-md visible-lg margin-zero"> <div class="top"> <h3 class="title"><i class="glyphicon glyphicon-th-list"></i> Questions connexes</h3> </div> <div class="article-relative-content"> <ul class="side_article_list"> <li class="side_article_list_item">Aucun problème connexe^_^</li> </ul> </div> </div> </div> </div> </div> </div> </div><!-- wrap end--> <!-- footer --> <footer id="footer"> <div class="bg-simple lt"> <div class="container"> <div class="row padder-v m-t"> <div class="col-xs-8"> <ul class="list-inline"> <li><a href="http://fr.uwenku.com/contact">Nous contacter</a></li> <li>© 2020 FR.UWENKU.COM</li> <li><a target="_blank" href="https://beian.miit.gov.cn/">沪ICP备13005482号-4</a></li> <li><script type="text/javascript" src="https://v1.cnzz.com/z_stat.php?id=1280101193&web_id=1280101193"></script></li> <li><a href="http://www.uwenku.com/" target="_blank" title="优文库">简体中文</a></li> <li><a href="http://hk.uwenku.com/" target="_blank" title="優文庫">繁體中文</a></li> <li><a href="http://ru.uwenku.com/" target="_blank" title="поле вопросов и ответов">Русский</a></li> <li><a href="http://de.uwenku.com/" target="_blank" title="Frage - und - antwort - Park">Deutsch</a></li> <li><a href="http://es.uwenku.com/" target="_blank" title="Preguntas y respuestas">Español</a></li> <li><a href="http://hi.uwenku.com/" target="_blank" title="कार्यक्रम प्रश्न और उत्तर पार्क">हिन्दी</a></li> <li><a href="http://it.uwenku.com/" target="_blank" title="IL Programma di chiedere Park">Italiano</a></li> <li><a href="http://ja.uwenku.com/" target="_blank" title="プログラム問答園区">日本語</a></li> <li><a href="http://ko.uwenku.com/" target="_blank" title="프로그램 문답 단지">한국어</a></li> <li><a href="http://pl.uwenku.com/" target="_blank" title="program o park">Polski</a></li> <li><a href="http://tr.uwenku.com/" target="_blank" title="Program soru ve cevap parkı">Türkçe</a></li> <li><a href="http://vi.uwenku.com/" target="_blank" title="Đáp ứng viên">Tiếng Việt</a></li> <li><a href="http://fr.uwenku.com/" target="_blank" title="Programme interrogation Park">Française</a></li> </ul> </div> </div> </div> </div> </div> </footer> <!-- / footer --> <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?f78a970f17b19a79fc477a3378096f29"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> </body> </html>