Definition: shift(): this array method is used to remove first element of an array and returns the new array. pop(): this array method is used to remove last element of an array and returns the new array. See the below code example: [crayon-698f5333db4db439338661/]
Read moreDefinition: slice(): this array method is used to slice out specific portion of an array and returns new array. or We can use this method to get specific part and remove remaining part of an array. We can use two arguments in this method like slice(1,3). When we use two
Read moreDefinition: shift(): this method is use to remove first element of an array and returns new array. unshift(): this array method is used to add one or more arrays in existing array list and returns new array. usages of shift(): [crayon-698f5333dfb79430153089/] usages of unshift(): [crayon-698f5333dfb82734973769/]
Read moreevent.preventDetault() method: event.preventDetault() method stops default action of the element, e.g. In preventDefault() method when click on element like <a> its stops the link to executed or on Form submit button click stop form to be submitted. HTML: <div id="div-element"> <a id="anchor-element" href="http://www.xyz.com" target="_blank"> xyz.com </a> </div> CODE: $(“document”).ready(function(){ $(“#anchor-element”).click(function(event){ event.preventDefault(); }); }); event.stopPropagation() method: event.stopPropagation() method stops event handlers
Read moreFlex container's children (flex items) properties order flex-grow flex-shrink flex-basis flex align-self 1. order By using "order" property we can change the order of each flex item available in the flex container. { order: <integer>; } We must set order value in number, by default order value is 0. We can also use negative numbers in this property. - See usage
Read moreParent flex container properties display flex-direction flex-wrap flex-flow 1. display { display: flex | inline-flex } "display" defines a flex container; when you specify "display" value to "flex" it consider as block container and if you specify "display" value to "inline-flex" it consider as inline-block container. - See usage and the differences shown in the below examples. display: flex CSS [crayon-698f5333e5caa994582388/] HTML [crayon-698f5333e5cb3011630829/] In
Read moreClick here more details about "How to use flex properties? - Part 1" article Parent flex container properties justify-content align-items align-content 5. justify-content This property used to align the flex items. { justify-content: flex-start | flex-end | center | space-around | space-between | space-evenly } This property horizontally aligns all flex items when items do not use all
Read moreDefinition: width(): This method gives width of the selected element (excluding padding, border and margin). innerWidth(): This method gives width of the selected element (including padding, excluding border and margin). outerWidth(): This method gives width of the selected element (including padding and border, excluding margin). outerWidth(true): This method gives width of the selected element
Read moreDefinition: :first – use this selector to select first element. This selector select only one single element from all related elements available on the page. :first-child – use this selector to select all first child elements from each parent. :first-of-type – use this selector to select all first child elements, of a specific
Read moreCSS: div{ width:600px; height:400px; border:5px solid black; background-image: url('image.jpg'); /*Add your image path here*/ background-repeat: no-repeat; background-position: right 75% center; /*For all browser except Safari*/ background-position-x: 25%; /*For support all browsers with Safari browser*/ background-position-y: 50%; /*For support all browsers with Safari browser*/ margin:0 auto; } DEMO
Read more