Leveraging the power of the Vivid.JS library with Internet Explorer

Recently, I stumbled upon Vivid.JS, an SVG Icons library that caught my attention due to its lightweight nature and customization options. The usage instructions are simple and straightforward:

<i data-vi="icon-name"></i>

Unfortunately, I encountered an issue where the icons are not displaying on IE8, although they work perfectly in Google Chrome. Has anyone else experienced this problem with the SVG library on IE8? While I could resort to using Font Awesome or a similar alternative, Vivid.JS is only a 38KB library, and I just need a couple of icons. Any insights or suggestions would be greatly appreciated. Thank you!

javascriptinternet-explorersvg

Answer №2

After much consideration, I opted for the SVG + JavaScript implementation of Font Awesome. By eliminating unnecessary icons from the JavaScript file, I successfully managed to trim down the file size to approximately 30KB.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Submitting information through Ajax

Struggling to update a field in my database using AJAX. No errors in console, but the DB won't update. Anyone able to help? AJAX: function ajaxUpdate() { var arr = {var1: name, var2: age}; $.ajax({ url: 'aja ...

javascriptphpjqueryajaxdatabase

What is the best method for swapping out an iframe with a div using Javascript?

Having an issue with loading an external HTML page into an iFrame on my website. Currently facing two main problems: The height of the iFrame is fixed, but I need it to adjust based on the content's height. The content inside the iFrame does not inh ...

javascriptiframehtml

Trigger AngularJS functionality upon the completion of loading a Partial routed by Express

I'm fairly new to AngularJS and recently ran into an issue that's been keeping me up at night... Our application is built on node.js and express, with all partial routing handled by Express. The problem I'm facing is this: Whenever I load ...

javascriptnode.jsangularjsexpress

Utilizing ExpressJS: importing Multer module in a separate file

After following the instructions in the GitHub readme file for multer, I encountered a dilemma. The readme suggested calling multer in middleware as shown below: app.js var multer = require('multer') app.post('/upload', upload.single( ...

javascriptnode.jsexpressmiddlewaremulter

Building a TTL based schema in NestJs with MongooseIn this guide, we will explore

In my NestJs(TypeScript) project, I am attempting to create a self-destructing schema using the mangoose and @nestjs/mongoose libraries. Unfortunately, I have been unable to find a clear way to implement this feature. While I know how to do it in an expres ...

javascriptnode.jstypescriptmongoosenestjs

When the page loads, sorting by numbers will automatically occur without requiring a click event

Hey there! I've got a modal set up for displaying event details like the one shown in this image: https://i.sstatic.net/73xTW.png Within this modal, users have the option to accept, reject, or leave events pending. In our API, the status values corre ...

javascriptreactjsreact-nativesorting

Executing JavaScript function on AJAX update in Yii CGridView/CListView

Currently, I am integrating isotope with Yii for my CListView and CGridView pages to enhance their display. While everything functions smoothly, an issue arises when pagination is utilized, and the content on the page is updated via ajax, causing isotope ...

javascriptphpjqueryajaxyii

Can you explain the functionality of express-async-handler?

Hello, I'm trying to understand the purpose of express-async-handler. I came across it in a repository I was exploring. According to the documentation, express-async-handler is a simple middleware designed to handle exceptions within asynchronous exp ...

javascriptnode.jsexpresserror-handlingasync-await

Learning to retrieve JSON data from an API using JavaScript

https://i.sstatic.net/OQZvD.pngGreetings! I am currently facing an issue while trying to retrieve JSON data from an API. Whenever I attempt to extract data from the API, everything works smoothly except for when I try to access the distance value, which re ...

javascriptjson

What is the process for invoking a websocket from an HTML client?

I have created a WCF Service using netHttpBinding binding and it is hosted on IIS 8 (Windows Server 2012). The interfaces for the service are as follows: [ServiceContract(CallbackContract = typeof(IDuplexCallbackContract))] public interface IHelloWebSocke ...

javascripthtmlwcfwebsocket

Using JavaScript to open links in a new tab with the target

document.getElementById("mahacareer").onclick = function () { window.open("http://www.mahacareermitra.in", '_blank'); }; <a href="" id="mahacareer">Access the portal</a> Hi there, I am looking to have the link above open in a new tab ...

javascriptjqueryhtmltwitter-bootstrapcss

Having trouble changing the style property of the `<div>` element in my JS function within Bootstrap Studio

I am currently utilizing Bootstrap in Bootstrap Studio along with plain JavaScript. One of the challenges I am facing pertains to changing the background color of a <div> element upon selecting a new tab. The objective is to dynamically alter the ba ...

javascripthtmlcssbootstrap-4bootstrap-studio

How can I set a condition to open a specific page in ReactJs?

Currently, I am in the process of developing a website and have successfully implemented a profile page. This profile page consists of three buttons - Settings, Favourites, and Posts. To enhance user experience, I decided to structure it as a multi-step fo ...

javascriptreactjs

Tips for using jQuery to adjust HTML attributes based on conditions

I'm still trying to figure out how to assign a different class attribute to an element based on another element's dynamic numberical attribute. Here is the HTML & PHP code I am working with: <?php for($i=1;$i<=$total;$i++){ ?> <a hr ...

javascriptphpjqueryhtmlcss

What is the total count of different types of objects present in the array?

... let stock = [ { candy: "Twix", available: 150, weeklyAverage: 200 }, { candy: "Kit Kat", available: 80, weeklyAverage: 100 }, { candy: "Skittles", available: 250, weeklyAverage: 170 }, { candy: "Reese's P ...

javascriptarraysfunction

The Art of JavaScript Module Patterns in Image Sliders

I'm diving into the world of JavaScript and decided to try my hand at creating an image slider. I managed to put together a basic version by following a couple of tutorials, and although it's working fine, I want to move it to an external js file ...

javascript

Using JavaScript to display dynamic data pulled from Django models

I am currently in the process of designing my own personal blog template, but I have encountered a roadblock when it comes to creating a page that displays previews of all posts. This particular page consists of two columns, #content-column-left and #conte ...

javascriptdjango

The issue arises when I try to retrieve information from MySQL using Ajax, as it appears

I am currently working on developing an ecommerce website. In order to display products, I am fetching data from a database. My goal is to allow users to add products to their cart without having to refresh the page. I have attempted to use AJAX for this ...

javascriptphphtmlmysqlajax

Tap the mobile menu button twice to toggle the menu

Incorporating: Visual Studio 2013, ASP.NET (VB) Webforms. Upgrading an existing WebForms website from .NET 2.0 to .NET 4.5 and implementing mobile-friendly features for better Google support. I have added a button to the top right corner as follows: < ...

javascripthtmlcss

Determine the RGB color values for specific coordinates within Adobe Illustrator

Currently exploring ExtendScript for JavaScript in Adobe Illustrator 2015. Is there a method to retrieve RGB values based on coordinates within the code below? // initializing document var doc = app.activeDocument; // defining x and y coordinates for colo ...

javascriptadobe-illustratorextendscript