Press "Enter" to skip to content

Html Button Styling Library by roxunlimited.com using CSS and jQuery

RxHTMLButton Library will work on nearly every HTML tag. It will work seamlessly on “href link“, “button type button“, “input type button“, “submit input type“, “div tag” or even “p tag“. The execution time is less than 5 minutes, just link your HTML buttons library to your website and get cool HTML buttons.

rxHTMLButton is a jQuery-based button generator that helps developers create unique CTA button designs to capture user attention.

With this plugin, you can quickly create animated, interactive, and customizable CTAs from any HTML elements like button, input, extension, etc.

How to make use of it:

1. Insert the& jQuery rxHTMLButton plugin’s information into the doc.

<script src="/path/to/jquery.min.js"></script>
<link href="/path/to/jquery-rxHtmlButton-min.css" rel="stylesheet" />
<script src="/path/to/jquery-rxHtmlButton-min.js"></script>

2. Create a primary CTA button on the web page.

<a class="alink" href="#">Hover Me</a>
$(".alink").rxHtmlButton();

3. Apply a pre-built theme to the button. Accept values: ‘rx01’, ‘rx02’, ‘rx03’, ‘rx04’, ‘rx05’.

$(".alink").rxHtmlButton({
  builtinTheme: "rx03"
});

4. Or customize the button with the next choices.

$(".alink").rxHtmlButton({

  // background color
  backgroundColor: "#2176B8",

  // background color on hover
  backgroundHoverColor: "",

  // enable gradient color
  gradient: true,
  backgroundBlendColor: "",
  gradientFrom: "top",
  backgroundBlendHoverColor: "",
  gradientIntensity: 30,

  // customize button border here
  border: true,
  borderWidth: 1,
  borderHoverWidth: "",
  borderColor: "",
  borderGradient: !1,
  borderGradientFrom: "top",
  borderBlendColor: "",
  borderHoverColor: "",
  borderBlendHoverColor: "#168C36",
  borderIntensity: 5,

  // custom button text on hover
  customText: false,
  customTextval: "Let's Go",

  // custom font on hover
  customFont:true,
  customFontStyle: "raleway",
  customFontColor: "",
  customFontHoverColor: "",
  customFontWeight: "",
  customFontSize: "",

  // custom arrow on hover
  customArrow: false,

  // or bullet", "double"
  customArrowStyle: "jet",

  // enable black overlay
  blackOverlay: false,
  
  // "big" | "calendar" | "full" | "none" | "oval" | "small"
  roundedCorner: "small",

  // expand the button on hover
  hoverExpand: false,

  // "small" | "medium" | "big"
  customSize: "medium",

  // enable animation
  animate: true
  
});

Attractive Call to Action Buttons, rxHTMLButton Library Plugin/Github, how to add call to action button on website, call to action examples, secondary call to action, call to action social media, call to action button animation, cta button capitalization


See Demo And Download

Official Website(roxunlimited): Click Here

This superior jQuery/javascript plugin is developed by roxunlimited. For extra Advanced Usages, please go to the official website.

Be First to Comment

    Leave a Reply

    Your email address will not be published. Required fields are marked *