XML Elves

XML Elves

<community>of XML and SVG Developers</community>


toggle opacity of a group

This is a discussion on toggle opacity of a group within the SVG Questions forums, part of the SVG Forums category; Hi, I found this JS funtion to toggle opacity in a SVG, the problem I have, is that each object ...


Go Back   XML Elves > SVG Forums > SVG Questions

Register FAQ Members List Calendar Search Today's Posts Mark Forums Read

Notices


Click here to register

Reply

 

LinkBack Thread Tools Display Modes
  #1 (permalink)  
Old 08-28-2007, 01:32 PM
Peter
Guest
 
Posts: n/a
Default toggle opacity of a group

Hi,
I found this JS funtion to toggle opacity in a SVG, the problem I have, is that each object changes the opacity, not the whole group!
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 13.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 14948) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="800px" height="600px" viewBox="0 0 232.559 274.425" enable-background="new 0 0 232.559 274.425"
xml:space="preserve">
<script type="text/javascript">
<![CDATA[
var SVGDocument = null;
var SVGRoot = null;

function Init(evt)
{
SVGDocument = evt.target.ownerDocument;
SVGRoot = SVGDocument.documentGroup;
}

function ToggleOpacity(evt, parentId)
{
var newTarget = evt.target;
if (parentId)
{
newTarget = SVGDocument.getElementById(parentId);
}
var newValue = newTarget.getAttributeNS(null, 'opacity');

if ('0' != newValue)
{
newValue = '0';
}
else
{
newValue = '1';
}
newTarget.setAttributeNS(null, 'opacity', newValue);

if (parentId)
{
SVGDocument.getElementById(parentId + 'Exception').setAttributeNS(null, 'opacity', '1');
}
}
]]>
</script>


<g id="Layer_12" onclick="ToggleOpacity(evt)">
<polyline fill="none" stroke="#FFFFFF" stroke-miterlimit="3.864" points="128.819,83.455 109.263,114.707 53.359,114.707 "/>
<path fill="#FFFFFF" d="M128.391,84.213c-0.401-0.251-0.523-0.78-0.272-1.181c0.251-0.402,0.779-0.524,1.181-0.273
c0.402,0.251,0.524,0.78,0.273,1.181C129.322,84.341 ,128.792,84.463,128.391,84.213"/>
<line fill="none" stroke="#FFFFFF" stroke-miterlimit="3.864" x1="133.167" y1="138.48" x2="109.263" y2="114.707"/>
<path fill="#FFFFFF" d="M132.524,137.892c0.335-0.335,0.877-0.335,1.212,0c0.334,0.335,0.334,0.877,0,1.212
c-0.335,0.335-0.877,0.335-1.212,0S132.189,138.227,132.524,137.892"/>
<line fill="none" stroke="#FFFFFF" stroke-miterlimit="3.864" x1="122.713" y1="179.063" x2="109.263" y2="114.707"/>
<path fill="#FFFFFF" d="M122.496,178.219c0.463-0.098,0.918,0.198,1.017,0.661c0.098,0.463-0.198,0.918-0.66,1.017
c-0.463,0.098-0.918-0.197-1.017-0.66S122.033,178.318,122.496,178.219"/>
<polyline fill="none" stroke="#000000" stroke-width="0.425" stroke-miterlimit="3.864" points="128.819,83.455 109.263,114.707
53.359,114.707 "/>
<path d="M128.54,83.951c-0.264-0.164-0.343-0.51-0.18-0.773c0.165-0.263,0.511-0.343,0.773-0.179
c0.263,0.165,0.344,0.511,0.179,0.774C129.148,84.03 6,128.802,84.116,128.54,83.951"/>

<line fill="none" stroke="#000000" stroke-width="0.425" stroke-miterlimit="3.864" x1="133.167" y1="138.48" x2="109.263" y2="114.707"/>
<path d="M132.746,138.095c0.22-0.219,0.574-0.219,0.794,0c0.22,0.219,0.22,0.575,0,0.793c-0.22,0.22-0.574,0.22-0.794,0
C132.526,138.67,132.526,138.314,132.746,138.095"/>

<line fill="none" stroke="#000000" stroke-width="0.425" stroke-miterlimit="3.864" x1="122.713" y1="179.063" x2="109.263" y2="114.707"/>
<path d="M122.57,178.51c0.305-0.063,0.603,0.129,0.667,0.433s-0.129,0.602-0.433,0.666c-0.303,0.064-0.601-0.129-0.666-0.433
C122.075,178.873,122.267,178.574,122.57,178.51"/>
</g>
</svg>

Thank you
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Reply

Tags
group, opacity, toggle


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)

 
Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On


All times are GMT -6. The time now is 01:06 PM.


Powered by vBulletin® Version 3.7.2
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
Search Engine Friendly URLs by vBSEO 3.2.0

Inkjet Printer Cartridges
Order your inkjet printer cartridges online and UK delivery is free.

printer cartridges
Don't settle for any old supplier. Get the best ink for the best price. See our great range of printer cartridges at competitive prices.

HARD DISK DRIVE DATA RECOVERY LANCASHIRE
Are you in Lancashire and desperate for someone to do data recovery of your hard disk drive? Call us at Data Clinic for a free quotation.

ink cartridges Free UK Delivery on ink cartridges such as Canon, Dell, Epson, hp & Lexmark.

1 2 3 4 5 6 7 8 9 10