Giant Giant - 20 days ago 5
CSS Question

share in sns working in other browser except in safari

<div class="container" id="snscontent">
<div >
<ul>
<li><a id="fb"href="#" class="share-to btn btn-primary" data-sns="facebook"><img src="images/facebook.png"/></a></li>
<li><a href="#" class="share-to btn btn-primary" data-sns="twitter"><img src="images/twitter.png"/></a></li>
<li><a href="#" class="share-to btn btn-primary" data-sns="google+"><img src="images/googleplus.png"/></a></li>
</ul>
</div>
<script type="text/javascript">
$(document).ready( function () {
$('.share-to').snsShare('share', 'http://localhost/var/www/html/sample/#');
});
</script>
</div>


This is a working share button for Facebook, Twitter, and Google+. It works in Chrome, Firefox, Opera, and IE, but when I tried it in Safari it is not working. I am testing it on Safari in Windows 8. Is there a work around for this? Any ideas are appreciated.

UPDATE


This includes a jQuery SNS Share Plugin by sj the code is below

/*
* jQuery SNS Share Plugin
*
* @author sj
* @link https://github.com/smajeack/SmartyGrid
* @copyright Copyright 2014 SJ
* @version 1.0.0
* @license Apache License Version 2.0 (https://github.com/samejack/SmartyGrid/blob/master/LICENSE)
*/
jQuery.fn.snsShare = function(message, url) {

var getAtagElement, makeMouseClickEvent, types;

/**
* Get ths a tag singleton
* @returns {HTMLElement}
*/
getAtagElement = function () {
var element = document.getElementById('hg-share-a-tag');
if (element === null) {
element = document.createElement('a');
element.style = "display: none;";
element.id = 'hg-share-a-tag';
element.target = "_blank";
document.getElementsByTagName('body')[0].appendChild(element);
}
return element;
};

/**
* Create a mouse click event
* @returns {Event}
*/
makeMouseClickEvent = function () {
var clickEvent = document.createEvent('MouseEvents');
clickEvent.initMouseEvent('click', true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
return clickEvent;
};

/**
* Implement SNS types
* @type {string[]}
*/
types = ['facebook', 'google+', 'line', 'twitter', 'plurk'];

// fix URL
if (typeof(url) === 'undefined') {
url = window.location;
}

return this.each(function () {
jQuery(this).click(function () {
var element, snsType = jQuery(this).attr('data-sns');;
if (typeof(snsType) === 'string' && jQuery.inArray(snsType, types) !== -1) {
if (typeof(message) === 'undefined') {
message = window.location;
}
switch (snsType) {
case 'facebook':
element = getAtagElement();
element.href = 'http://www.facebook.com/sharer.php?u=' + url + '&t=' + encodeURIComponent(message);
element.dispatchEvent(makeMouseClickEvent());
break;
case 'google+':
element = getAtagElement();
element.href = 'https://plus.google.com/share?url=' + encodeURIComponent(message + ' ' + url);
element.dispatchEvent(makeMouseClickEvent());
break;
case 'line':
element = getAtagElement();
element.href = 'http://line.naver.jp/R/msg/text/?' + encodeURIComponent(message + ' ' + url);
element.dispatchEvent(makeMouseClickEvent());
break;
case 'twitter':
element = getAtagElement();
element.href = 'http://twitter.com/home/?status=' + encodeURIComponent(message + ' ' + url);
element.dispatchEvent(makeMouseClickEvent());
break;
case 'plurk':
element = getAtagElement();
element.href = 'http://www.plurk.com/m?qualifier=shares&content=' + encodeURIComponent(message + ' ' + url);
element.dispatchEvent(makeMouseClickEvent());
break;
default:
alert('SNS type not found. (' + options + ')');
}
} else {
alert('data-sns attribute not set.');
}
});
});
};

Answer
<ul>
    <li><button id="rock" class="share-to btn btn-primary" data-sns="facebook"></button></li>
    <li><button class="share-to btn btn-info" data-sns="twitter"><img src="images/twitter.png"/></button></li>
    <li><button class="share-to btn btn-danger" data-sns="google+"><img src="images/googleplus.png"/></button></li>
</ul>
<script type="text/javascript"src="js/jquery-1.11.1.min.js"></script>

using button instead of anchor and putting the script in the page itself made it work in safari.before the script is located in the index.i am just wondering why it happened any special reason for this any explanation is appreciated