Front End Technology Articles - Page 531 of 652

Solve unknown gap between elements in Flexbox with HTML5.

Arjun Thakur
Updated on 24-Jun-2020 14:06:10

263 Views

Unknown gaps between elements in flexbox are due to margin collapsing of the header to the bar division. To resolve this −Either Margin is reset to 0 for header or Border is added to the bar.Padding can be done to bar by adding property padding: 10px to bar. Try the following code snippet to resolve the unknown gap problem −.bar {    background: yellow;    color: gray;    height: 250px;    padding: 10px;    text-align: center; }

HTML5 Geolocation without SSL connection

varma
Updated on 02-Jun-2020 07:41:28

875 Views

HTML 5 Geolocation is used to find out the location of the user. This can be without SSL connection. This can be generated as follows −// Variable apigeo shows successful location: var apigeo = function(position) {    alert("API geolocation success!lat = " + position.coords.latitude + "lng = " + position.coords.longitude); }; var tryapigeo = function() {    jQuery.post( "check the location on google map", function(success) {       apiGeolocationSuccess({coords: {latitude: success.location.lat, longitude: success.location.lng}});    }) //Gives success on given geolocation    .failure(function(err) { //On failure, alert with failure is shown       alert("error while showing geolocation! "+err);   ... Read More

How to get materialize CSS checkbox to work with @Html.CheckBoxFor?

Ankith Reddy
Updated on 04-Mar-2020 06:08:57

242 Views

The only way to materialize CSS checkbox to work with Html.checkbox without disappearance of the checkbox to the left is by moving the hidden element to the bottom of the parent element.$("input[type='hidden']").each(checkbox1 (0,IsActive ) {    $(this).appendTo($(IsActive).parent()); });In this hidden element, IsActive is placed in the bottom of parent element thus removing the disappearance of the checkbox to left and thus materializing CSS checkbox to work with HTML.checkbox.

What are Pure HTML export buttons in jQuery Data Table?

Lakshmi Srinivas
Updated on 24-Jun-2020 14:06:49

217 Views

jQuery Data Table provides export buttons with the help of which we can make a structure like the following −Export PDFExport CSVExport HTMLExport ExcelFor this, we need to write code −var tbl = $('#extable').DataTable({      dom: 'export',        buttons: [          {                 extend: 'collection',                 text: 'Export',                 buttons: [ 'csvHtml5', ' pdfHtml5', 'copyHtml5', 'excelHtml5' ]          }        ] });

Changing three.js background to transparent or another color in HTML

Giri Raju
Updated on 23-Nov-2023 14:22:48

1K+ Views

If you want a transparent background in three.js, you need a pass in the alpha parameter to the WebGLRenderer constructors in the below-given code − var renderer = new THREE.WebGLRenderer( {alpha: true } ); // You can leave the clear color at the defaultvalue. renderer.setClearColor( 0x000000, 0 ); //default However, to set the background color, renderer.setClearColor(0xb0f442 );

Convert HTML5 into standalone Android App

mkotla
Updated on 20-Nov-2023 12:13:12

2K+ Views

Steps Follow the below-given steps to convert HTML5 into standalone Android App You need to first create an Android app using Eclipse. Move HTML code to /assets folder −The Assets provide a way to include arbitrary files such as text, XML, music, fonts, and video in your application. Load web view with the file − android_asset/ file  enable javascript Layout for WebView While creating a layout for WebView − WebVieww = new WebView(this); w.loadUrl("http://www.app.com/");

What is the difference between SVG and HTML5 Canvas?

George John
Updated on 01-Jun-2020 11:14:08

10K+ Views

The HTML element is a container for SVG graphics. SVG stands for Scalable Vector Graphics. SVG and useful for defining graphics such as boxes, circles, text, etc. SVG stands for Scalable Vector Graphics and is a language for describing 2D-graphics and graphical applications in XML and the XML is then rendered by an SVG viewer. Most of the web browsers can display SVG just like they can display PNG, GIF, and JPG.The HTML element is used to draw graphics, via JavaScript. The element is a container for graphics.SVGHTML CanvasSVG has better scalability. So it can be printed with ... Read More

Streaming a video file to an HTML5 video player with Node.js so that the video controls continue to work

Prabhas
Updated on 04-Mar-2020 05:25:44

327 Views

Use createReadStream to send the requested part to the client. The function call createReadStream() will give you a readable stream. ExampleThe following is the code −stream = fs.createReadStream(path); stream.on('open', function () {    res.writeHead(206,{       "Content-Range":"bytes " + begin + "-" + end + "/" +total, "Accept-Ranges":"bytes",          "Content-Length":chunksize, "Content-Type":"new/mp4"    });    stream.pipe(res); });

Drawing an image from a data URL to a HTML5 canvas

Arjun Thakur
Updated on 04-Mar-2020 05:06:54

1K+ Views

If you have a data url, you can create an image to a canvas. This can be done as shown in the following code snippet −var myImg = new Image; myImg.src = strDataURI;The drawImage() method draws an image, canvas, or video onto the canvas. The drawImage() method can also draw parts of an image, and/or increase/reduce the image size.The code given below is also appropriate with the sequence - create the image, set the onload to use the new image, and then set the src −// load image from data url Var Obj = new Image(); Obj.onload = function() { ... Read More

How to properly use h1 in HTML5?

varun
Updated on 04-Mar-2020 05:06:02

303 Views

 h1 is a heading and not a title. Youcan gives own heading element to each sectioning element. h1 cannot be the title. It can be the heading of that particular section of the page. Each article can have its own title. defines the most important heading. The first element is considered the label for the entire document. It is perfectly fine to use as many tags as your document calls for; that is one per sectioning root or content section. Use one set of tags per sectioning root or content section. There should always be an ... Read More

Advertisements