拉斐爾圖標大小

我在我的網站一對夫婦拉斐爾圖標是這樣的：拉斐爾圖標大小

var emailIcon = Raphael("js-email-icon"); 
    emailIcon.path('M28.516,7.167H3.482l12.517,7.108L28.516,7.167zM16.74,17.303C16.51,17.434,16.255,17.5,16,17.5s-0.51-0.066-0.741-0.197L2.5,10.06v14.773h27V10.06L16.74,17.303z').attr({fill: '#ff00ff', stroke: "none"});

我怎樣才能讓圖標變大？

謝謝！

來源

2012-04-12 mb.

編輯：好吧，意識到你可能不會使用jQuery這是哪裏的.css（）的由來。

我會建議使用jQuery和嘗試：

$(emailIcon.path('M28.516,7.167H3.482l12.517,7.108L28.516,7.167zM16.74,17.303C16.51,17.434,16.255,17.5,16,17.5s-0.51-0.066-0.741-0.197L2.5,10.06v14.773h27V10.06L16.74,17.303z').attr({fill: '#ff00ff', stroke: "none"})).css({width: "500px", height: "500px"});

我只是包裝一切都交給attr像這樣$(...).css({width:'500px',height:'500px'})

或

$(emailIcon.path(...).attr({fill...stroke...})).css({width:'500px',height:'500px'});

如果你不想使用jQuery，然後AS LONG作爲Rapheal .attr（）函數返回DOM元素，你可以這樣做：

var tmp = emailIcon.path(...).attr({fill...stroke...}); 
tmp.style.width= '500px'; 
tmp.style.height= '500px';

來源

2012-04-12 17:05:39 Kasapo

這實際上不起作用。任何其他想法？ – 2012-04-12 17:54:57

使用變換方法：http://raphaeljs.com/reference.html#Element.transform

例如，使其正常大小的150％：

var emailIcon = Raphael("js-email-icon"); 
var iconPath = emailIcon.path('M28.516,7.167H3.482l12.517,7.108L28.516,7.167zM16.74,17.303C16.51,17.434,16.255,17.5,16,17.5s-0.51-0.066-0.741-0.197L2.5,10.06v14.773h27V10.06L16.74,17.303z').attr({fill: '#ff00ff', stroke: "none"}); 
iconPath.transform("s1.5");

來源

2012-06-23 00:04:31 lafncow

如果你有一個實際的SVG文件用，最簡單的方法來工作，我建議使用Adobe Illustrator或Inkscape等程序來修改圖標的大小。一旦完成，只需提取路徑信息，然後會出現一個更大的圖標。

這些程序將爲您做所有的雜亂路徑計算，並讓您在應用代碼之前瞭解它的外觀。但是，在使用Inkscape時要小心，因爲有時它不會修改路徑，只是向對象拉斐爾用戶不做任何事情的對象添加變換。

來源

2013-05-01 02:16:53

拉斐爾圖標大小

回答

相關問題