HTML – N77 Design | NickClaeboe.com https://www.nickclaeboe.com Atlanta Web, Graphic & Flyer Design • Design Portfolio & Rates for Nick Claeboe Custom Design Work Wed, 03 Mar 2021 15:29:16 +0000 en-US hourly 1 https://wordpress.org/?v=6.5.5 https://www.nickclaeboe.com/wp-content/uploads/2016/05/favicon-60x60.png HTML – N77 Design | NickClaeboe.com https://www.nickclaeboe.com 32 32 Smooth Scrolling CSS jQuery Trick Hack Code Tutorial https://www.nickclaeboe.com/2016/07/04/smooth-scrolling-css-trick-hack-code-tutorial/ Mon, 04 Jul 2016 20:13:04 +0000 http://ec2-54-186-150-17.us-west-2.compute.amazonaws.com/?p=369

While coding websites for several different clients, I’ve repeatedly had the need to a smooth scroll anchor function. Through several hours of searches and digging, I found something, that was actually in a comment somewhere, that executed the scroll function perfectly. Just a few lines of code and viola! It’s very light weight and uses a bit of css and jquery.

Place the code below right before the closing head tag “</head>”

<!-- SMOOTH SCROLL PLACE IN HEAD -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(function() {
$('a[href*=#]:not([href=#])').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
if (target.length) {
$('html,body').animate({
scrollTop: target.offset().top
}, 1000);
return false;
}
}
});
});
</script>
<!-- End of SMOOTH SCROLL -->

And now with the following code, place it just after the opening <body> tag.

<body>
tag ==> <div name="top"> </div>
<p>somethings</p>
ANCHOR LINK ==>    <a href="#top"> Go to top </a>

Try it out for yourself and enjoy the results.

]]>
How to build a spam-free contact form without captchas https://www.nickclaeboe.com/2014/06/28/how-to-build-a-spam-free-contact-form-without-captchas/ Sat, 28 Jun 2014 21:16:59 +0000 http://dev.nickclaeboe.com/?p=155

This is a great tutorial I’ve used to fight back again spam on some of the website that I design. Most site use a captcha system to deter spam but that can kill your conversions sometimes. With the method in this tutorial, you can set up a spam-free contact for without captchas. It uses simple css, javascript and html. You’ll need to have a basic understanding of all three of these to complete this tutorial.

How to build a spam-free contact form without captchas: Read More…

]]>