语言

Menu
Sites
Language
Marquee Text Not Working

Hello!

I'm dynamically building a template and trying to use the Marquee tau widget when headline titles are too long. Currently, the ui-marquee styles work, but the dynamic widget does not scroll the text like it should and I'm having trouble trying to find the solution. Any help is welcome!

 

HTML Code:

My div has an id of "activityMainTitle" and a class of "ui-marquee"

JS Code:

...
var $activityMainTitle = $section.querySelector('#activityMainTitle'); 

// Marquee #activityMainTitle if too long 
if (activityMainTitle.length >= 12) { 
   marqueeWidget = tau.widget.Marquee($activityMainTitle);
   marqueeWidget.start();
}

 

列表

响应

6 回复
colin Rao

Hi,

Which version are you use? I don't find such Marquee widget/api in tau.js file. My local SDK version is Tizen SDK 2.3 Rev3

Vikram

Hi Colin,

I thins this is new feature in Tizen 2.3.1. You can check in https://developer.tizen.org/development/tools/download/release-notes/tizen-sdk/2.3.1-sep-3-2015 and check the "Web UI Framework (TAU)" part.

 

 

Palitsyna

Hello,

you can find more information about Marquee Widget here: https://developer.tizen.org/dev-guide/2.3.1/org.tizen.web.apireference/html/ui_fw_api/wearable/widgets/widget_marquee.htm

And you can find there that this component is supported since 2.3.

colin Rao

Hi,

Seems the sample code not working as above link. The text can's scrolling, both on web simulator and realdevice (Tizen Z1).

Marco Buettner

The Marquee-Widget is available for Wearables not for Mobile :)

AVSukhov

Hello,

I have tested on emulator and it works fine:

my code:

<div class="ui-page ui-page-active" id="main">
    	<header class="ui-header">
			<h2 class="ui-title">TAU Basic</h2>
		</header>
		<div class="ui-content content-padding">
			<ul class="ui-listview">
				<li><div class="ui-marquee" id="marquee">Marquee widget code sample adfdsf adsgfdsgfdsg</div></li>
			</ul>
		</div>
		<button id="start">Start</button>
		<button id="reset">Reset</button>
	</div>

js

var buttonStart = document.querySelector("#start"),
        marqueeWidget;
	buttonStart.addEventListener("click", function() {
		var marqueeEl = document.getElementById("marquee");
		marqueeWidget = new tau.widget.Marquee(marqueeEl, {iteration: "infinite"});
		marqueeWidget.start();
	});
	var buttonReset = document.querySelector("#reset");
	buttonReset.addEventListener("click", function() {
		marqueeWidget.reset();
	});