Discussion:
[svg-developers] How to get lightboxes work with SVG? the "rel=" code is beeing discard!
omdawe@yahoo.com [svg-developers]
2016-02-18 09:13:50 UTC
Permalink
Hello!

I been trying this for a couple of hours to have on a SVG image links to open in a lightbox!

And i cant find any information how to convert the "rel=" all lightboxes use to in the link into SVG format!..

I tried many variations!..

This is in the html!.. of course it it also includes all the HTML and SVG meta data!
<a xlink:href="images/fullscreen/2.jpg" xlink:rel="prettyPhoto">

<path id="samambaia-liveaboard-speedboat-tender" class="st27" d="M114.8,134.2c-0.3-0.2-4.3-3-2.6-4c1.3-0.8,3.4,2.3,3.4,2.3
s1.6-5,3.5-3.8c2.2,1.4-1.5,4.2-1.5,4.2s4.2,0,6.2,0c2,0,2.9-3.2,3.2-3.5c0.3-0.3,0.8-0.5,1.2-0.5c0.1,0,1,0.1,2,0.2v-4
c0,0,65,0,85.3,0c20.3,0,30.2,15.8,30.2,15.8s-9.9,15.8-30.2,15.8c-20.3,0-85.3,0-85.3,0v-4.3c-1.1,0.1-1.9,0.2-2,0.2
c-0.4,0-0.9-0.2-1.2-0.5s-1.2-3.5-3.2-3.5c-2,0-6.2,0-6.2,0s3.7,2.8,1.5,4.2c-1.9,1.2-3.5-3.8-3.5-3.8s-2,3-3.4,2.3
c-1.7-1,2.3-3.8,2.6-3.9c-0.3-0.2-4.3-3-2.6-4c1.3-0.8,3.4,2.3,3.4,2.3s1.6-5,3.5-3.8c2.2,1.4-1.5,4.2-1.5,4.2s4.2,0,6.2,0
c2,0,2.9-3.2,3.2-3.5c0.3-0.3,0.8-0.5,1.2-0.5c0.1,0,1,0.1,2,0.2v-2.6c-1.1,0.1-1.9,0.2-2,0.2c-0.4,0-0.9-0.2-1.2-0.5
c-0.3-0.3-1.2-3.5-3.2-3.5c-2,0-6.2,0-6.2,0s3.7,2.8,1.5,4.2c-1.9,1.2-3.5-3.8-3.5-3.8s-2,3-3.4,2.3
C110.5,137.2,114.6,134.4,114.8,134.2z"/>
</a>

</g>

So its opens the picture in the same tab, but not in the PrettyPhoto!..
http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/ http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/

Its not just prettyPhoto i tried also other lightboxes!..


Any help would be nice!.. Thanks
favier@comete.com [svg-developers]
2016-02-23 01:39:12 UTC
Permalink
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
</head>







<body style="background-color: #fff;">
<span style="display:none">&nbsp;</span>

<!--~-|**|PrettyHtmlStartT|**|-~-->
<div id="ygrp-mlmsg" style="position:relative;">
<div id="ygrp-msg" style="z-index: 1;">
<!--~-|**|PrettyHtmlEndT|**|-~-->

<div id="ygrp-text" >


<p>Temporairement indisponible, je vous invite à contacter mon équipe pour toute demande <br><br>
par téléphone au 04 78 39 56 13
<br><br>ou par mail :<br>
Frédéric Béchet – Directeur Associé : <a href="mailto:***@comete.com">***@comete.com</a> <br> Caroline Soleilhac – Directrice Clientèle : <a href="mailto:***@comete.com">***@comete.com</a>



</p>

</div>


<!--~-|**|PrettyHtmlStart|**|-~-->
<div style="color: #fff; height: 0;">__._,_.___</div>






<div style="clear:both"> </div>

<div id="fromDMARC" style="margin-top: 10px;">
<hr style="height:2px ; border-width:0; color:#E3E3E3; background-color:#E3E3E3;">
Posted by: ***@comete.com <hr style="height:2px ; border-width:0; color:#E3E3E3; background-color:#E3E3E3;">
</div>
<div style="clear:both"> </div>

<table cellspacing=4px style="margin-top: 10px; margin-bottom: 10px; color: #2D50FD;">
<tbody>
<tr>
<td style="font-size: 12px; font-family: arial; font-weight: bold; padding: 7px 5px 5px;" >
<a style="text-decoration: none; color: #2D50FD" href="https://groups.yahoo.com/neo/groups/svg-developers/conversations/messages/66533;_ylc=X3oDMTJxdDV0NjIzBF9TAzk3MzU5NzE0BGdycElkAzEyOTg0MjEEZ3Jwc3BJZAMxNzA2MDMwMzkwBG1zZ0lkAzY2NTMzBHNlYwNmdHIEc2xrA3JwbHkEc3RpbWUDMTQ1NjE5MTU1Ng--?act=reply&messageNum=66533">Reply via web post</a>
</td>
<td>&bull;</td>
<td style="font-size: 12px; font-family: arial; padding: 7px 5px 5px;" >
<a href="mailto:***@comete.com?subject=Re%3A%20%5Bsvg-developers%5D%20How%20to%20get%20lightboxes%20work%20with%20SVG%3F%20the%20%22rel%3D%22%20code%20is%20beeing%20discard%21" style="text-decoration: none; color: #2D50FD;">
Reply to sender </a>
</td>
<td>&bull;</td>
<td style="font-size: 12px; font-family: arial; padding: 7px 5px 5px;">
<a href="mailto:svg-***@yahoogroups.com?subject=Re%3A%20%5Bsvg-developers%5D%20How%20to%20get%20lightboxes%20work%20with%20SVG%3F%20the%20%22rel%3D%22%20code%20is%20beeing%20discard%21" style="text-decoration: none; color: #2D50FD">
Reply to group </a>
</td>
<td>&bull;</td>
<td style="font-size: 12px; font-family: arial; padding: 7px 5px 5px;" >
<a href="https://groups.yahoo.com/neo/groups/svg-developers/conversations/newtopic;_ylc=X3oDMTJlbmo0bW8yBF9TAzk3MzU5NzE0BGdycElkAzEyOTg0MjEEZ3Jwc3BJZAMxNzA2MDMwMzkwBHNlYwNmdHIEc2xrA250cGMEc3RpbWUDMTQ1NjE5MTU1Ng--" style="text-decoration: none; color: #2D50FD">Start a New Topic</a>
</td>
<td>&bull;</td>
<td style="font-size: 12px; font-family: arial; padding: 7px 5px 5px;color: #2D50FD;" >
<a href="https://groups.yahoo.com/neo/groups/svg-developers/conversations/topics/66533;_ylc=X3oDMTM2OTlvbzJiBF9TAzk3MzU5NzE0BGdycElkAzEyOTg0MjEEZ3Jwc3BJZAMxNzA2MDMwMzkwBG1zZ0lkAzY2NTMzBHNlYwNmdHIEc2xrA3Z0cGMEc3RpbWUDMTQ1NjE5MTU1NgR0cGNJZAM2NjUzMw--" style="text-decoration: none; color: #2D50FD;">Messages in this topic</a>
(1)
</td>
</tr>
</tbody>
</table>



<!------- Start Nav Bar ------>
<!-- |**|begin egp html banner|**| -->
<!-- |**|end egp html banner|**| -->


<div id="ygrp-grfd" style="font-family: Verdana; font-size: 12px; padding: 15px 0;">

<!-- |**|begin egp html banner|**| -->

-----<BR>
To unsubscribe send a message to: svg-developers-***@yahoogroups.com<BR>
-or-<BR>
visit <a href="http://groups.yahoo.com/group/svg-developers">http://groups.yahoo.com/group/svg-developers</a> and click &quot;edit my membership&quot;<BR>
----
<!-- |**|end egp html banner|**| -->

</div>




<!-- |**|begin egp html banner|**| -->
<div id="ygrp-vital" style="background-color: #f2f2f2; font-family: Verdana; font-size: 10px; margin-bottom: 10px; padding: 10px;">

<span id="vithd" style="font-weight: bold; color: #333; text-transform: uppercase; "><a href="https://groups.yahoo.com/neo/groups/svg-developers/info;_ylc=X3oDMTJlZGF1NTZ1BF9TAzk3MzU5NzE0BGdycElkAzEyOTg0MjEEZ3Jwc3BJZAMxNzA2MDMwMzkwBHNlYwN2dGwEc2xrA3ZnaHAEc3RpbWUDMTQ1NjE5MTU1Ng--" style="text-decoration: none;">Visit Your Group</a></span>

<ul style="list-style-type: none; margin: 0; padding: 0; display: inline;">
<li style="border-right: 1px solid #000; font-weight: 700; display: inline; padding: 0 5px; margin-left: 0;">
<span class="cat"><a href="https://groups.yahoo.com/neo/groups/svg-developers/members/all;_ylc=X3oDMTJmZGpodHZvBF9TAzk3MzU5NzE0BGdycElkAzEyOTg0MjEEZ3Jwc3BJZAMxNzA2MDMwMzkwBHNlYwN2dGwEc2xrA3ZtYnJzBHN0aW1lAzE0NTYxOTE1NTY-" style="text-decoration: none;">New Members</a></span>
<span class="ct" style="color: #ff7900;">1</span>
</li>
</ul>
</div>


<div id="ft" style="font-family: Arial; font-size: 11px; margin-top: 5px; padding: 0 2px 0 0; clear: both;">
<a href="https://groups.yahoo.com/neo;_ylc=X3oDMTJkN3N1NmV1BF9TAzk3NDc2NTkwBGdycElkAzEyOTg0MjEEZ3Jwc3BJZAMxNzA2MDMwMzkwBHNlYwNmdHIEc2xrA2dmcARzdGltZQMxNDU2MTkxNTU3" style="float: left;"><img src="Loading Image..." height="15" width="137" alt="Yahoo! Groups" style="border: 0;"/></a>
<div style="color: #747575; float: right;"> &bull; <a href="https://info.yahoo.com/privacy/us/yahoo/groups/details.html" style="text-decoration: none;">Privacy</a> &bull; <a href="mailto:svg-developers-***@yahoogroups.com?subject=Unsubscribe" style="text-decoration: none;">Unsubscribe</a> &bull; <a href="https://info.yahoo.com/legal/us/yahoo/utos/terms/" style="text-decoration: none;">Terms of Use</a> </div>
</div>
<br>

<!-- |**|end egp html banner|**| -->

</div> <!-- ygrp-msg -->


<!-- Sponsor -->
<!-- |**|begin egp html banner|**| -->
<div id="ygrp-sponsor" style="width:160px; float:right; clear:none; margin:0 0 25px 0; background: #fff;">

<!-- Start Recommendations -->
<div id="ygrp-reco">
</div>
<!-- End Recommendations -->



</div> <!-- |**|end egp html banner|**| -->

<div style="clear:both; color: #FFF; font-size:1px;">.</div>
</div>

<img src="http://geo.yahoo.com/serv?s=97359714/grpId=1298421/grpspId=1706030390/msgId=66533/stime=1456191556" width="1" height="1"> <br>

<img src="http://y.analytics.yahoo.com/fpc.pl?ywarid=515FB27823A7407E&a=10001310322279&js=no&resp=img" width="1" height="1">

<div style="color: #fff; height: 0;">__,_._,___</div>
<!--~-|**|PrettyHtmlEnd|**|-~-->

</body>

<!--~-|**|PrettyHtmlStart|**|-~-->
<head>
<style type="text/css">
<!--
#ygrp-mkp {
border: 1px solid #d8d8d8;
font-family: Arial;
margin: 10px 0;
padding: 0 10px;
}

#ygrp-mkp hr {
border: 1px solid #d8d8d8;
}

#ygrp-mkp #hd {
color: #628c2a;
font-size: 85%;
font-weight: 700;
line-height: 122%;
margin: 10px 0;
}

#ygrp-mkp #ads {
margin-bottom: 10px;
}

#ygrp-mkp .ad {
padding: 0 0;
}

#ygrp-mkp .ad p {
margin: 0;
}

#ygrp-mkp .ad a {
color: #0000ff;
text-decoration: none;
}
#ygrp-sponsor #ygrp-lc {
font-family: Arial;
}

#ygrp-sponsor #ygrp-lc #hd {
margin: 10px 0px;
font-weight: 700;
font-size: 78%;
line-height: 122%;
}

#ygrp-sponsor #ygrp-lc .ad {
margin-bottom: 10px;
padding: 0 0;
}

#actions {
font-family: Verdana;
font-size: 11px;
padding: 10px 0;
}

#activity {
background-color: #e0ecee;
float: left;
font-family: Verdana;
font-size: 10px;
padding: 10px;
}

#activity span {
font-weight: 700;
}

#activity span:first-child {
text-transform: uppercase;
}

#activity span a {
color: #5085b6;
text-decoration: none;
}

#activity span span {
color: #ff7900;
}

#activity span .underline {
text-decoration: underline;
}

.attach {
clear: both;
display: table;
font-family: Arial;
font-size: 12px;
padding: 10px 0;
width: 400px;
}

.attach div a {
text-decoration: none;
}

.attach img {
border: none;
padding-right: 5px;
}

.attach label {
display: block;
margin-bottom: 5px;
}

.attach label a {
text-decoration: none;
}

blockquote {
margin: 0 0 0 4px;
}

.bold {
font-family: Arial;
font-size: 13px;
font-weight: 700;
}

.bold a {
text-decoration: none;
}

dd.last p a {
font-family: Verdana;
font-weight: 700;
}

dd.last p span {
margin-right: 10px;
font-family: Verdana;
font-weight: 700;
}

dd.last p span.yshortcuts {
margin-right: 0;
}

div.attach-table div div a {
text-decoration: none;
}

div.attach-table {
width: 400px;
}

div.file-title a, div.file-title a:active, div.file-title a:hover, div.file-title a:visited {
text-decoration: none;
}

div.photo-title a, div.photo-title a:active, div.photo-title a:hover, div.photo-title a:visited {
text-decoration: none;
}

div#ygrp-mlmsg #ygrp-msg p a span.yshortcuts {
font-family: Verdana;
font-size: 10px;
font-weight: normal;
}

.green {
color: #628c2a;
}

.MsoNormal {
margin: 0 0 0 0;
}

o {
font-size: 0;
}

#photos div {
float: left;
width: 72px;
}

#photos div div {
border: 1px solid #666666;
height: 62px;
overflow: hidden;
width: 62px;
}

#photos div label {
color: #666666;
font-size: 10px;
overflow: hidden;
text-align: center;
white-space: nowrap;
width: 64px;
}

#reco-category {
font-size: 77%;
}

#reco-desc {
font-size: 77%;
}

.replbq {
margin: 4px;
}

#ygrp-actbar div a:first-child {
/* border-right: 0px solid #000;*/
margin-right: 2px;
padding-right: 5px;
}

#ygrp-mlmsg {
font-size: 13px;
font-family: Arial, helvetica,clean, sans-serif;
*font-size: small;
*font: x-small;
}

#ygrp-mlmsg table {
font-size: inherit;
font: 100%;
}

#ygrp-mlmsg select, input, textarea {
font: 99% Arial, Helvetica, clean, sans-serif;
}

#ygrp-mlmsg pre, code {
font:115% monospace;
*font-size:100%;
}

#ygrp-mlmsg * {
line-height: 1.22em;
}

#ygrp-mlmsg #logo {
padding-bottom: 10px;
}


#ygrp-msg p a {
font-family: Verdana;
}

#ygrp-msg p#attach-count span {
color: #1E66AE;
font-weight: 700;
}

#ygrp-reco #reco-head {
color: #ff7900;
font-weight: 700;
}

#ygrp-reco {
margin-bottom: 20px;
padding: 0px;
}

#ygrp-sponsor #ov li a {
font-size: 130%;
text-decoration: none;
}

#ygrp-sponsor #ov li {
font-size: 77%;
list-style-type: square;
padding: 6px 0;
}

#ygrp-sponsor #ov ul {
margin: 0;
padding: 0 0 0 8px;
}

#ygrp-text {
font-family: Georgia;
}

#ygrp-text p {
margin: 0 0 1em 0;
}

#ygrp-text tt {
font-size: 120%;
}

#ygrp-vital ul li:last-child {
border-right: none !important;
}
-->
</style>
</head>

<!--~-|**|PrettyHtmlEnd|**|-~-->
</html>
<!-- end group email -->

Loading...