Posts

Showing posts from January, 2019

Add (+/-) Button Number Incrementers using jQuery

-
Image
Add (+/-) Button Number Incrementers using jQuery A common use would be a "quantity" input on an eCommerce site. The plus and minus field value interaction is done using jQuery, Add (+/-) Button Number Incrementers using jQuery.  HTML  <form id='myform' method='POST' action='#'>     <input type='button' value='-' class='qtyminus' field='quantity' />     <input type='text' name='quantity' value='0' class='qty' />     <input type='button' value='+' class='qtyplus' field='quantity' /> </form> More information please visit this url  https://www.papawebdesigner.com/  CSS  <style> #myform {     text-align: center;     padding: 5px;     border: 1px dotted #ccc;     margin: 2%; } .qty {     width: 40px;     height: 25px;     text-align: center; } input.qtyplus { width:25px; height:25px;} input.q...
Post a Comment
Read more

How to upload multiple files & preview using jQuery

-
Image
How to upload multiple files & preview using  jQuery in the code we are uploading more than one file with using js to fully dynamic multipal file upload and also see the previous images.  HTML  <input type="file" id="filesss" multiple="" /> <div id="dragimgappend"></div> More information please visit this url  https://www.papawebdesigner.com/  CSS  <style type="text/css"> .documentUploadS img {     width: 140px; } .documentUploadS {     position: relative; } span.selFile {     cursor: pointer;     font-weight: 500;     position: absolute;     right: 0;     z-index: 99999999;     top: 0;     background: red;     color: #fff;     width: 20px;     text-align: center; } div#dragimgappend > div {     display: inline-block;     margin-right: 8px;...
Post a Comment
Read more

How to remove Youtube suggested videos when you use iframe?

-
Image
How to remove Youtube suggested videos when you use iframe? When you are using youtube iframe videos on your website then youtube gives the youtube suggested video at the end of the video as it is not possible to do this but i had tried to provide the solutions by using a simple trick.  HTML  <div id="playerWrapOuter">  <div id="playerWrap">  <iframe width="640" height="360" src="https://www.youtube.com/embed/IlXjoPtTGT8?rel=0&enablejsapi=1" frameborder="0" ></iframe> </div> </div> More information please visit this url  https://www.papawebdesigner.com/  CSS  <style> #playerWrap { display: inline-block; position: relative; } #playerWrap.shown::after { content: ""; position: absolute; top: 0; left: 0; bottom: 0; right: 0; cursor: pointer; background-color: black; background-...
Post a Comment
Read more

Top 5 New Features in CSS 3

-
Image
Top 5 New Features in CSS 3 Cascading Style Sheets [CSS] , CSS3 is the latest version of the Cascading Style Sheets a lot's of new featured add like - rounded corners, shadows, gradients, transitions or animations new layouts like multi-columns, flexible box or grid layouts, Please see Below Top 5 New Features in CSS3. #1. CSS Animations and Transitions A transition is the simplest form of CSS3 animation A transition occurs when an element changes from one state to another, and the browser fills in that state change with a sequence of in-between frames. It has a beginning and an end state. What are Transitions? A transition occurs when an element changes from one state to another. We most often see transitions used on hover states, or when information on a page is added or removed. The hover states might be a subtle change in font color, The demonstration above works well but the state transition is very abrupt. Let’s apply a little CSS3 magic What are Animations?...
Post a Comment
Read more

Fade in Fade Out custom slider using css3

-
Image
Fade in Fade Out custom slider using css3 In this tutorial we will create a CSS3 only image slider very simple and clean code i have add css and little html using Fade in Fade Out custom slider.  HTML  <ul class="cb-slideshow">     <li><span>Image 01</span><div><h3>Hello</h3></div></li>     <li><span>Image 02</span><div><h3>Hello</h3></div></li>     <li><span>Image 03</span><div><h3>Hello</h3></div></li>     <li><span>Image 04</span><div><h3>Hello</h3></div></li>     <li><span>Image 05</span><div><h3>Hello</h3></div></li>     <li><span>Image 06</span><div><h3>Hello</h3></div></li> </ul> ...
1 comment
Read more

What is new in html 5

-
Image
What is new in html 5 The <!DOCTYPE html> declaration is used to inform a website visitor's browser that the document being rendered is an HTML 5 document. There are plenty of new tags in HTML 5 which we can use easily. And many new elements have come in Html 5. New Elements in HTML5 <article>, <footer>, <header>, <main>,  <aside>, <mark>, <progress>, <section>, <summary>, <time>, <bdi>, <details>, <dialog>, <figcaption>, <figure> HTML5 Graphics <canvas>,  <svg> New Media Elements <audio>, <video>, <embed>, <source>, <track> New Input Types email, month, number, range, search, tel, time, url, week, color, date, datetime, datetime-local . Follow On Social Media - Follow on Facebook   -   https://www.facebook.com/Front-End-Issue-487743404963344 Follow on instagram...
Post a Comment
Read more