Comment Jquery
How do I make an comment jquery?
What is a comment jquery? How do you make a comment jquery? This script and codes were developed by Bradley Engelhardt on 13 August 2022, Saturday.
Comment Jquery - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Comment Jquery</title> <link rel="stylesheet" href="css/style.css">
</head>
<body>
<html> <head> <!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> <link href='http://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'> <link href="style.css" rel="stylesheet"> </head> <body> <div class="container"> <form> <div class="form-group"> <textarea class="form-control status-box" rows="2" placeholder="What's on your mind?"></textarea> </div> </form> <div class="button-group pull-right"> <p class="counter">140</p> <a href="#" class="btn btn-danger">Delete</a> <a href="#" class="btn btn-primary">Post</a> </div> <ul class="posts"> </ul> </div> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="app.js"></script> </body>
</html> <script src="js/index.js"></script>
</body>
</html>
Comment Jquery - Script Codes CSS Codes
html
body { font-family: 'Roboto', sans-serif; color: #404040; background-color: #eee;
}
.container { max-width: 520px; margin-top: 20px;
}
.button-group { margin-bottom: 20px;
}
.counter { display: inline; margin-top: 0; margin-bottom: 0; margin-right: 10px;
}
.posts { clear: both; list-style: none; padding-left: 0;
}
.posts li { background-color: #fff; border: 1px solid #d8d8d8; padding-top: 10px; padding-left: 20px; padding-right: 20px; padding-bottom: 10px; margin-bottom: 10px; word-wrap: break-word; min-height: 42px; border-radius: 4px;
}
li.selected { background-color: red;
}
Comment Jquery - Script Codes JS Codes
var main = function() { $('.btn-primary').click(function() { var post = $('.status-box').val(); $('<li>').text(post).prependTo('.posts'); $('.status-box').val(''); $('.counter').text('140'); $('.btn-primary').addClass('disabled'); }); $('.posts li').on('click', function(){ $(this).addClass('selected'); }); $('.btn-danger').click(function() { $('selected').remove(); }); $('.status-box').keyup(function() { var postLength = $(this).val().length; var charactersLeft = 140 - postLength; $('.counter').text(charactersLeft); if(charactersLeft < 0) { $('.btn').addClass('disabled'); } else if(charactersLeft == 140) { $('.btn').addClass('disabled'); } else { $('.btn').removeClass('disabled'); } }); $('.btn').addClass('disabled');
};
$(document).ready(main);
Developer | Bradley Engelhardt |
Username | SquishyAndroid |
Uploaded | August 13, 2022 |
Rating | 3 |
Size | 2,421 Kb |
Views | 36,432 |
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!
Name | Size |
Simple parallax scroll | 2,325 Kb |
One-page Scrolling with animations | 2,372 Kb |
Local Storage | 1,709 Kb |
Playing with slide out drawers | 2,812 Kb |
Tip Calculator | 2,915 Kb |
Coin Flip | 2,142 Kb |
Embedded video header | 2,670 Kb |
Personal Webpage | 8,067 Kb |
Codecademy Flipboard | 3,793 Kb |
Giphy API Random Gif Selector | 2,636 Kb |
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!
Name | Username | Size |
Simple Accordion | Wearebold | 3,683 Kb |
Portfolio Page | KaylaMT | 1,983 Kb |
Cool audio | Bigliam | 1,868 Kb |
Material design - button rainbow circle | Kunukn | 3,652 Kb |
Emberjs Bootstrap Modal Carousel | Somethingkindawierd | 4,233 Kb |
Material design buttons | Fischaela | 4,381 Kb |
Basic HTML5 Structure | YuvarajTana | 1,289 Kb |
CSS3 Selectables with information rollover | Jasonmayes | 9,565 Kb |
A Pen by Markku Lehmonen | SharpDal | 7,804 Kb |
Horizontal scroll fixed element | HerrSerker | 0 Kb |
Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!