font-awesome

问题 I want a single icon sound player which when a user click plays a sound file... The only requirement is that it should be pure HTML CSS only... No JavaScript please <a href="test.mp3"><i class="fa fa-sound"></a> 回答1: It is possible but only using javascript. you can do it using following code: <audio id="player" src="Kalimba.mp3"></audio> <div> <a onclick="document.getElementById('player').play()"><i class='fa fa-volume-up fa-2x'></i></a> </div> Good Luck! Edit: The href colour will make it

问题 I have no idea how to insert fontawesome inside Select2. What should I add the CSS or JS in it? I have a view like below. click : http://s10.postimg.org/675fig9vd/Capture121212121.png Can anyone help me? 回答1: Based on my plugin WP Mobile Splash Page Editor, I made a quick fiddle: http://jsfiddle.net/SiamKreative/qCn6p/ function format(icon) { var originalOption = icon.element; return '<i class="fa ' + $(originalOption).data('icon') + '"></i> ' + icon.text; } $('.wpmse_select2').select2({

问题 i'm trying to use fontawesome with imagemagick to display it's character as png , here is my code: $size = '50'; $text = ''; $imgW = 200; $imgH = 200; $font = 'fontawesome-webfont.ttf'; $image = new Imagick(); $image->setResolution(144,144); $draw = new ImagickDraw(); $draw->setFont($font); $draw->setFontSize($size); //$draw->setTextEncoding('UTF-8'); //$draw->setStrokeAntialias(true); //$draw->setTextAntialias(true); $image->newImage($imgW, $imgH, new ImagickPixel('none')); $image-

问题 Is it possible to use font icon in selector instead of drawable ? <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android" > <item android:drawable="@drawable/menu_home_press" android:state_pressed="true"></item> <item android:drawable="@drawable/menu_home"></item> </selector> 回答1: I changed text color in selector instead of drawable. Its working fine. Create MyTextView class which extends TextView public class MyTextView extends TextView {

问题 Is there a way to use icons from Semantic UI or FontAwseome as markers icons in OpenLayers3 ? OpenLayers features the feature style Text that can be used as follows: var blackFill = new ol.style.Fill({color: 'black'}) var whiteStroke = new ol.style.Stroke({color: 'white', width: 1}) var iconText = new ol.style.Text({font: "<my font>", text: "<some string>", fill: blackFill, stroke: whiteStroke }) var featureStyle = new ol.style.Style({ text: iconText }); After checking the style of Semantic

问题 I'm trying to center a font awesome icon over an image when the mouse is hovering the image. Here's my HTML: <div class="profile-img-container"> <img src="http://s3.amazonaws.com/37assets/svn/765-default-avatar.png" class="img-thumbnail img-circle img-responsive" /> <i class="fa fa-upload fa-5x"></i> </div> And my CSS: .profile-img-container { position: relative; } .profile-img-container img:hover { opacity: 0.5; } .profile-img-container img:hover + i { display: block; z-index: 500; }

问题 I am trying to use font-awesome icons as a placeholder in search input field. Jsfiddle examples I use corresponding html entity as a placeholder, then use pseudo class to style placeholder with correct font-family (example 2 in jsfiddle): HTML: <div class="wrapper"> <input class="icon" type="text" placeholder="" /> </div> CSS: .wrapper { font-family:'arial', sans-serif; } input.icon { padding:5px; } input.icon::-webkit-input-placeholder { font-family:'FontAwesome'; } input.icon::-moz

问题 I'm trying to swap .fa-eye to fa-eye-slash when user click on a button. What am I doing wrong? It's not working. HTML code: <button onclick="arata_ascunde(this);" style="align:right;font-size:13px" class="btn btn-info " id="show_hide_bt" style="background-color:#00b0ff;"><i class="fa fa-eye"></i> Show</button> Javascript code: function arata_ascunde(button) { var x = document.getElementById('showhide'); var change = document.getElementById("show_hide_bt"); if (x.style.display === 'none') { x

问题 I created a font icons set with FontAwesome icons and free icomoon icons set with Icomoon app . The default baseline in the app is 6.25% . When I compare default FontAwesome icons and FontAwesome icons from icomoon app they are off by few px. In the image below , the button on the left is using default FontAwesome font , the button on the right is using same font icon created with icomoon app. You can see that the icon in the button on the right is up by 2px or so. Their CSS is almost same

问题 I created a font icons set with FontAwesome icons and free icomoon icons set with Icomoon app . The default baseline in the app is 6.25% . When I compare default FontAwesome icons and FontAwesome icons from icomoon app they are off by few px. In the image below , the button on the left is using default FontAwesome font , the button on the right is using same font icon created with icomoon app. You can see that the icon in the button on the right is up by 2px or so. Their CSS is almost same