JQuery Cousins Method

Developer
James Podles
Size
2,682 Kb
Views
4,048
  1. JQuery Cousins Method Previews
  2. JQuery Cousins Method HTML Codes
  3. JQuery Cousins Method CSS Codes
  4. JQuery Cousins Method JS Codes

How do I make an jquery cousins method?

Selects the children (with the same element type) of the element's parent's siblings.. What is a jquery cousins method? How do you make a jquery cousins method? This script and codes were developed by James Podles on 01 February 2023, Wednesday.

JQuery Cousins Method Previews
IQ Test

JQuery Cousins Method - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>jQuery Cousins Method</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <ul> <li><a>one</a></li> <li><a>two</a></li> <li><a>three</a></li>
</ul> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

JQuery Cousins Method - Script Codes CSS Codes

@import url(https://fonts.googleapis.com/css?family=Open+Sans:300);
* { box-sizing: border-box;
}
ul { font-family: 'Open Sans',sans-serif; font-weight: 300; width: 100%; top: 0; left: 0; right: 0; bottom: 0; position: absolute; margin: auto; height: 5em;
}
ul li:first-child a { background-color: #33404D;
}
ul li:nth-child(2) a { background-color: #688F7D;
}
ul li:nth-child(3) a { background-color: #2C223B;
}
li { width: 25%; font-size: 3em; float: left; margin: .5em;
}
a { color: #fafafa; width: 100%; border-radius: 5px; display: inline-block; padding: 5px 10px 10px 10px; text-align: center; -webkit-transition: -webkit-transform .5s ease-in-out; transition: -webkit-transform .5s ease-in-out; transition: transform .5s ease-in-out; transition: transform .5s ease-in-out, -webkit-transform .5s ease-in-out;
}
a:hover { cursor: pointer;
}
.active { -webkit-transform: scale(1.2); transform: scale(1.2);
}

JQuery Cousins Method - Script Codes JS Codes

$.fn.cousins = function(){ var element = this.prop('tagName'); var $cousins = this.parent().siblings().children(element); return $cousins;
}
$('a').hover(function(){ $(this).addClass('active').cousins().removeClass('active');
});
JQuery Cousins Method - Script Codes
JQuery Cousins Method - Script Codes
Home Page Home
Developer James Podles
Username jpod
Uploaded February 01, 2023
Rating 3
Size 2,682 Kb
Views 4,048
Do you need developer help for JQuery Cousins Method?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

James Podles (jpod) Script Codes
Name
Flyer-flip
Reading Progress Bar
Photo Grid
PracticeIO Circle Fan Menu
SoundCloud CoverFlow
PracticeIO Click Counter
Stack of Cards
Soft Progress bar
CSS Bot Confusion
Scrambled City
Create amazing blog posts with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!