Hi, Joshua-
Nothing wrong with your idea, you made a simple typo: XML is case-sensitive,
so it should be "repeatCount", not "repeatcount". Also, if you had 2
"hidden" values, it will be hidden twice as much as it is visible... dunno
if that's your intent, but it's worth mentioning.
<circle cx="100" cy="50" r="60" fill="none" stroke="black"
visibility="hidden">
<animate attributeName="visibility" values="visible; hidden"
begin="0s" dur="0.2s" repeatCount="indefinite" />
</circle>
Francis' example is another good approach, and has the advantage that it
would also work in viewers that support scripting but not SMIL animation
(Batik and Firefox, right now, but Firefox will have SMIL next year). I'd
add 2 caveats, though:
You had used visibility as an attribute, rather than as a style propery, so
in this case, Francis' code would work, because the style property has
greater specifity than the visibility attribute (according to the rules of
CSS)... but mixing style properties (style="visibility:hidden;") and style
attributes (visibility="hidden") is begging for trouble. So, Francis' code
is correct, I just wanted to interject a note of caution. Just so you know,
any style property in SVG can also be written as an attribute. I'd only use
CSS for style classes, not for inline styles.
Francis also used an Adobe-specific method, "getStyle()", which won't work
in Firefox, Batik, or any other viewer. Instead, substitute "style" (so,
here, "circleBlinker.style;"). It is the official way to do it, it's
portable (it works in ASV as well), and it saves keystrokes. ;)
Regards-
Doug
[EMAIL PROTECTED]
www.vectoreal.com ...for scalable solutions.
Francis Hemsher wrote:
|
| Hi Joshua,
| Actually, to accomplish this, your don't need the animate element.
|
| Try:
|
| var circleBlinker=//---access your circle via getElementId i
| guess is the easiest---
|
| //--start the blinker via some event, onload, whatever---
| function startBlinker() {
| BlinkerInterval=setInterval("blinkIt()", 500); }
|
| function blinkIt()
| {
|
| var blinkerStyle=circleBlinker.getStyle();
| var blinkVis=blinkerStyle.getPropertyValue("visibility")
| if(blinkVis=="visible")
| blinkerStyle.setProperty("visibility", "hidden");
| else
| blinkerStyle.setProperty("visibility", "visible"); }
|
| Francis
|
| --- In [email protected], "Joshua Woodward"
| <[EMAIL PROTECTED]> wrote:
| >
| > Ok, what I am trying to do is make a circle go from visible to
| hidden
| > over and over again. I can get it to do it if I have two
| animations:
| > one that goes from visible to hidden and one that goes from hidden
| to
| > visible. But I was wondering if I could make one animation that
| would
| > repeat from hidden to visible without typing
| > values="hidden;visible;hidden;visible;hidden...
| > I cannot get the repeatcount to work with this type of animation
| at all.
| > I have also tried animating "display" and it seems to do the same
| thing.
| >
| > See the code below.
| >
| > <circle cx="100" cy="50" r="60" style="fill:none; stroke:black;"
| > visibility="hidden">
| > <animate id="cc" attributeName="visibility" values="hidden;
| > visible;hidden" begin="0s" dur="0.2s" repeatcount="indefinite" />
| > </circle>
| >
------------------------ Yahoo! Groups Sponsor --------------------~-->
Get Bzzzy! (real tools to help you find a job). Welcome to the Sweet Life.
http://us.click.yahoo.com/A77XvD/vlQLAA/TtwFAA/1U_rlB/TM
--------------------------------------------------------------------~->
-----
To unsubscribe send a message to: [EMAIL PROTECTED]
-or-
visit http://groups.yahoo.com/group/svg-developers and click "edit my
membership"
----
Yahoo! Groups Links
<*> To visit your group on the web, go to:
http://groups.yahoo.com/group/svg-developers/
<*> To unsubscribe from this group, send an email to:
[EMAIL PROTECTED]
<*> Your use of Yahoo! Groups is subject to:
http://docs.yahoo.com/info/terms/
