Free Programming Source Codes and Computer Programming Tutorials

Monday, May 25, 2020

Hide and Show Effects in jQuery

I wrote this program to demonstrate the hide and show effects in jQuery.

I am currently accepting programming work inventory system, enrollment system, accounting system, payroll system, information system, website design and development using WordPress, IT projects, school and application development, programming projects, thesis, and capstone projects, IT consulting work, computer tutorials, and web development work kindly contact me in the following email address for further details. If you want to advertise on my website kindly contact me also in my email address also. Thank you.

My email address is the following jakerpomperada@gmail.com, jakerpomperada@aol.com, and jakerpomperada@yahoo.com.My mobile number here in the Philippines is 09173084360. My telephone number at home here in Bacolod City, Negros Occidental Philippines is +63 (034) 4335675.

Here in Bacolod City, Negros Occidental I also accepting computer repair, web development using WordPress, Computer Networking, and Arduino Project development at a very affordable price. My personal website is http://www.jakerpomperada.com

My programming website is http://www.jakerpomperada.blogspot.comI am also a book author you can purchase my books on computer programming and information technology in the following links below.

https://www.unlimitedbooksph.com/

Program Listing

<html>

<head>

<title>The jQuery Hide and Show Example</title>

<style>

body,h3 {

font-family: arial;

font-size:16px;

font-weight:bold;

}

</style>

$(document).ready(function() {

$("#show").click(function () {

$(".mydiv").show(1000);

});

$("#hide").click(function () {

$(".mydiv").hide(1000);

});

</script>

<style>

.mydiv{

margin:10px;

padding:12px;

border:2px solid #666;

width:100px;

height:100px;

}

</style>

</head>

<body>

<h3>The jQuery Hide and Show Example</h3>

jQuery Hide and Show effect

and Animation Example

</div>

<input id = "hide" type = "button"

title="Click here to hide the image." value = "Hide" />

<input id = "show" type = "button"

title="Click here to show the image."value = "Show" />

</body>

</html>

Greet a Person Using jQuery

A simple program that I wrote that will ask the user to give his or her name and then the program will greet the person's name using jQuery.

My programming website is http://www.jakerpomperada.blogspot.comI am also a book author you can purchase my books on computer programming and information technology in the following links below.

https://www.unlimitedbooksph.com/

Program Listing

index.htm

<!DOCTYPE html>

<html>

<head>

body {

background-color:white;

font-family: arial;

font-size:15px;

font-weight:bold;

}

</style>

$(document).ready(function(){

$("form").submit(function(){

var names= document.getElementById("fname").value;

var display = names.toUpperCase();

alert("Hello " + display + " How are you?");

});

</script>

</head>

<form>

What is your name?

</form>

</body>

</html>

Thursday, May 21, 2020

Ordered List in HTML

This program was written and given to us by my friend Sir Ernel to show how to use the ordered list in HTML.

My programming website is http://www.jakerpomperada.blogspot.comI am also a book author you can purchase my books on computer programming and information technology in the following links below.

https://www.unlimitedbooksph.com/

Program Listing

<!DOCTYPE html>

<html>

<head>

<title>HTML Ordered List</title>

</head>

<body>

<h4> Default Numerals </h4>

<li>Tiger</li>

</ol>

<h4>Upper-Case Numerals</h4>

<li>Tiger</li>

</ol>

<h4> Lower-Case Numerals </h4>

<li>Tiger</li>

</ol>

<h4>Lower-Case Letters </h4>

<li>Tiger</li>

</ol>

<h4>Upper-Case Letters </h4>

<li>Tiger</li>

</ol>

</body>

</html>

Unordered List in HTML

A simple program that wrote by my friend Sir Ernel to show how to declare and use unordered list in HTML.

My programming website is http://www.jakerpomperada.blogspot.comI am also a book author you can purchase my books on computer programming and information technology in the following links below.

https://www.unlimitedbooksph.com/

Program Listing

<!DOCTYPE html>

<html>

<head>

<title>TYPE ATTRIBUTE</title>

</head>

<body>

<h4>Square attribute example </h4>

<li>Tiger</li>

</ul>

<h4>Disc attribute example </h4>

<li>Tiger</li>

</ul>

<h4>circle attribute example </h4>

<li>Tiger</li>

</ul>

<h4>none attribute example </h4>

<li>Tiger</li>

</ul>

</body>

</html>

Forms in HTML

This program was written and given to us by my friend Sir Ernel to show how to use forms in HTML.

My programming website is http://www.jakerpomperada.blogspot.comI am also a book author you can purchase my books on computer programming and information technology in the following links below.

https://www.unlimitedbooksph.com/

Program Listing

<!DOCTYPE html>

<html>

<head>

<style>

input[type=text] {

width: 100%;

padding: 12px 20px;

margin: 8px 0;

box-sizing: border-box;

}

input[type=text1] {

width: 100%;

padding: 12px 20px;

margin: 8px 0;

box-sizing: border-box;

border: 4px solid steelblue;

border-radius: 4px;

}

input[type=text2] {

width: 100%;

box-sizing: border-box;

border: 2px solid #ccc;

border-radius: 4px;

font-size: 16px;

background-color: white;

background-image: url

('sicon.png');

background-position: 10px 10px;

background-repeat: no-repeat;

padding: 12px 20px 12px 40px;

}

input[type=text3] {

width: 130px;

box-sizing: border-box;

border: 3px solid steelblue;

border-radius: 4px;

font-size: 16px;

background-color: white;

background-image: url('sicon.png');

background-position: 10px 10px;

background-repeat: no-repeat;

padding: 12px 20px 12px 40px;

-webkit-transition: width 0.4s

ease-in-out;

transition: width 0.4s ease-in-out;

}

input[type=text3]:focus {

width: 60%;

}

</style>

</head>

<body>

<h3>Padded Text fields:</h3>

<form>

<label for="fname">First Name

</label>

<input type="text" id="fname"

name="fname">

<input type="text" id="lname"

name="lname">

</form>

<h3> Bordered Text Fields</h3>

<form>

<label for="fname">First Name</label>

<input type="text1" id="fname"

name="fname">

<input type="text1" id="lname"

name="lname">

</form>

<h3>Text Fields with icon/image </h3>

<form>

<input type="text2" name="search"

placeholder="Search..">

</form>

<h3> Animated Text Field </h3>

<form>

<input type="text3" name="search"

placeholder="Search..">

</form>

</body>

</html>

Image Gallery using HTML and CSS

An image gallery program written by good friend Sir Ernel.

My programming website is http://www.jakerpomperada.blogspot.comI am also a book author you can purchase my books on computer programming and information technology in the following links below.

https://www.unlimitedbooksph.com/

Program Listing

<!DOCTYPE html> <html> <head> <style> div.img { margin: 10px; border: 1px solid #ccc; float: left; width: 120px; height : 200px; } div.img:hover { border: 3px solid steelblue; } div.img img { width: 100%; height: 100px; } div.desc { padding: 15px; text-align: center; } </style> </head> <body> <div class="img"> <a target="_blank" href= "img_tiger.jpg"> <img src="img_tiger.jpg" alt="tiger" width="300" height="200"> </a> <div class="desc">This is a Tiger </div> </div> <div class="img"> <a target="_blank" href= "img_olm.jpg"> <img src="img_olm.jpg" alt="olm" width="300" height="200"> </a> <div class="desc">This is a Olm </div> </div> <div class="img"> <a target="_blank" href= "img_pygmy.jpg"> <img src="img_pygmy.jpg" alt="pygmy" width="300" height="200"> </a> <div class="desc">This is a Pygmy Marmoset </div> </div> <div class="img"> <a target="_blank" href= "img_tarsier.jpg"> <img src="img_tarsier.jpg" alt= "tarsier" width="300" height="200"> </a> <div class="desc">This is Tarsier </div> </div> </body> </html>

Mouse Events Using AngularJS

A program written by my friend and fellow software engineer Sir Ernel. About mouse events using AngularJS.

My programming website is http://www.jakerpomperada.blogspot.comI am also a book author you can purchase my books on computer programming and information technology in the following links below.

https://www.unlimitedbooksph.com/

Program Listing

<!DOCTYPE html>

<html>

/ajax/libs/angularjs/1.6.9/angular.min.js"

></script>

<body>

<div id ="ID1" ng-app="firstAPP"

ng-controller="Ctrl1">

<b>Increase the count variable when the

mouse moves over the H1 element:</b>

<h1 ng-mousemove="count = count + 1"

>Mouse Over Me!

</h1>

<h2>{{ count }}</h2>

</div>

var app = angular.module('firstAPP', []);

app.controller('Ctrl1', function($scope) {

$scope.count = 0;

});

angular.bootstrap(document.getElementById

("ID1"), ['firstAPP']);

</script>

</body>

</html>

Convert Vowels into Upper Case in C++

Here is a program is given to us by my friend Tom. This program asks the user to give a string and then the program will convert all the vowels into upper case format in the given string.

My programming website is http://www.jakerpomperada.blogspot.comI am also a book author you can purchase my books on computer programming and information technology in the following links below.

https://www.unlimitedbooksph.com/

Sample Program Output

Program Listing

#define _CRT_SECURE_NO_WARNINGS

#include <iostream>

#include <string>

#include <cctype>

using namespace std;

bool is_vowel(char ch)

{

const string vowels("aeiouAEIOU");

return vowels.find(ch) != string::npos;

}

string& vowels_to_upper(string& s)

{

for (char &ch : s)

if (is_vowel(ch) && islower(ch))

ch = toupper(ch);

return s;

}

int main()

{

string input;

cout <<"\n\n";

cout << "\tConvert Vowels into Upper Case in C++";

cout <<"\n\n";

while (true)

{

cout << "\tEnter a string (or quit): ";

getline(cin, input);

if (input == "quit")

break;

cout <<"\t" <<vowels_to_upper(input) << '\n';

cout <<"\n";

}

cout <<"\n";

cout <<"\tEnd of Program";

cout <<"\n";

}

Wednesday, May 20, 2020

Greet a Person Using AngularJS

I write this program to greet a person using AngularJS.

My programming website is http://www.jakerpomperada.blogspot.comI am also a book author you can purchase my books on computer programming and information technology in the following links below.

https://www.unlimitedbooksph.com/

Program Listing

<html>

<body>

<p>Give your name in the input box:</p>

<br>

<h1>Welcome! {{user_name}} How are you?</h1>

</div>

</body>

</html>

FadeOut Method in jQuery

I wrote this program that demonstrates the FadeOut Method in jQuery.

My programming website is http://www.jakerpomperada.blogspot.comI am also a book author you can purchase my books on computer programming and information technology in the following links below.

https://www.unlimitedbooksph.com/

Program Listing

<html>

<head>

<title>jQuery hide Method with duration and callback parameters</title>

<style>

body,p {

font-family: arial;

font-size:16px;

font-weight:bold;

}

h4 {

font-family: arial;

font-weight:bold;

}

</style>

function fadeOutDiv() {

$("#divMsg").fadeOut(500,function(){

alert("The fadeOut method is completed!");});

}

</script>

</head>

<body>

<div>

FadeOut Method in jQuery</div>

</body>

</html>

Addition of Three Numbers Using Subroutine in Perl

I wrote this program to ask the user to give three numbers and then the program will compute the sum of three numbers using subroutine using the Perl programming language.

My programming website is http://www.jakerpomperada.blogspot.comI am also a book author you can purchase my books on computer programming and information technology in the following links below.

https://www.unlimitedbooksph.com/

Program Listing

# pass_value_subroutine.pl

# Author : Jake R. Pomperada,MAED-IT,MIT

# Date : April 7, 2020 Tuesday 11:34 AM

# Location : Bacolod City, Negros Occidental

# Email : jakerpomperada@gmail.com

# Website : http://www.jakerpomperada.com

print("\n");

# Subroutine to add the two values given

# by the user.

sub Sum_All {

$sum = 0;

foreach $item (@_) {

$sum += $item;

}

printf("\n");

printf("\tThe sum of %d, %d and %d is %d.",$num1,$num2,$num3,$sum);

print("\n\n");

print("\t\tEnd of Program");

print("\n");

}

sub Addition {

print("\tAddition of Three Numbers Using Subroutine in Perl");

print("\n\n");

print("\tEnter First Value : ");

chomp($num1=<STDIN>);

print("\tEnter Second Value : ");

chomp($num2=<STDIN>);

print("\tEnter Third Value : ");

chomp($num3=<STDIN>);

$sum = Sum_All($num1,$num2,$num3);

}

# Calling the Subroutine

Addition();

Reading Numbers from a Text File and removing leading zeros Using C++

A program in C++ written by my friend Tom to read a series of numbers from a text file and removing leading zeros.

My programming website is http://www.jakerpomperada.blogspot.comI am also a book author you can purchase my books on computer programming and information technology in the following links below.

https://www.unlimitedbooksph.com/

Program Listing

main.cpp

#include <iostream>
#include <fstream>
#include <vector>
#include <string>
#include <sstream>

using namespace std;

void process_line(string& line);
vector<string> process_lines(const std::string& filename);
void output_lines(std::vector<std::string> &lines);

int main()
{
   vector<string> lines = process_lines("input.txt");
   output_lines(lines);
}

vector<string> process_lines(const std::string& filename)
{
   vector<string> lines;
   string line;

   ifstream src(filename);
   while (getline(src, line))
   {
     process_line(line);
     lines.push_back(line);
   }
   return lines;
}

void process_line(string& line)
{
   istringstream iss(line);
   ostringstream oss;
   int num;

   while(iss >> num)
     oss << num << ' ';

   line = oss.str();
}

void output_lines(std::vector<std::string> &lines)
{
   cout << "Output numbers without leading zeros\n";
   for (const string& s : lines)
     cout << s << '\n';
}

input.txt

1 2 3 4 5 6 7 8 9 10
01 002 03 0004 005 006 007 00008 0009 010

Monday, May 18, 2020

Product of Two in Java Using Getters and Setters in Java

A simple program to ask the user to give two numbers and then it will compute the product using getters and setters in Java programming language.

My programming website is http://www.jakerpomperada.blogspot.comI am also a book author you can purchase my books on computer programming and information technology in the following links below.

https://www.unlimitedbooksph.com/

Program Listing

package oop_java;

import java.util.Scanner;

/**

* NetBeans IDE 8.2

* @author Mr. Jake R. Pomperada

* March 22, 2018 Thursday

* Bacolod City, Negros Occidental

public class ProductTwo {

int val_a;

int val_b;

public int getVal_a() {

return val_a;

}

public void setVal_a(int val_a) {

this.val_a = val_a;

}

public int getVal_b() {

return val_b;

}

public void setVal_b(int val_b) {

this.val_b = val_b;

}

public int solveProduct()

{

return(val_a * val_b);

}

public static void main(String[] args) {

Scanner input = new Scanner(System.in);

ProductTwo num = new ProductTwo();

System.out.println();

System.out.println("Product of Two in Java Using Getters and Setters");

System.out.println();

System.out.print("Enter first value : ");

num.val_a = input.nextInt();

System.out.print("Enter second value : ");

num.val_b = input.nextInt();

num.setVal_a(num.val_a);

num.setVal_b(num.val_b);

num.getVal_a();

num.getVal_b();

num.solveProduct();

System.out.println();

System.out.print("The product of " +num.val_a + " and " + num.val_b

+ " is " + num.solveProduct() + ".");

System.out.println("\n");

System.out.print("\t END OF PROGRAM");

System.out.println("\n");

input.close();

}

Addition of Two Numbers Using OOP in Java

I wrote this simple program in Java to ask the user to give two numbers and then the program will compute the total sum of two numbers.

My programming website is http://www.jakerpomperada.blogspot.comI am also a book author you can purchase my books on computer programming and information technology in the following links below.

https://www.unlimitedbooksph.com/

Program Listing

package oop_java;

import java.util.Scanner;

/**

* NetBeans IDE 8.2

* @author Mr. Jake R. Pomperada

* March 22, 2018 Thursday

* Bacolod City, Negros Occidental

class Addition {

public int val_a;

public int val_b;

public int sum;

public void getdata() {

Scanner input = new Scanner(System.in);

System.out.print("Addition of Two Numbers Using OOP ");

System.out.println("\n");

System.out.print("Give First Value : ");

val_a = input.nextInt();

System.out.print("Give Second Value : ");

val_b = input.nextInt();

}

public void calculate(){

sum =(val_a + val_b);

}

public void display() {

System.out.println("\n");

System.out.println("The sum of " + val_a + " and "

+ val_b + " is " + sum + ".");

System.out.println("\n");

System.out.println("End of Program");

}

public static void main(String args[]) {

Addition add = new Addition();

add.getdata();

add.calculate();

add.display();

}

Leap Year Checker Using OOP in Java

I wrote this program to accept the user input a year and then the program will check if the given year is a leap year or not using object-oriented programming in Java.

My programming website is http://www.jakerpomperada.blogspot.comI am also a book author you can purchase my books on computer programming and information technology in the following links below.

https://www.unlimitedbooksph.com/

Program Listing

package oop_java;

import java.util.Scanner;

/**

* NetBeans IDE 8.2

* @author Mr. Jake R. Pomperada

* March 22, 2018 Thursday

* Bacolod City, Negros Occidental

public class LeapYear {

public int year;

public boolean leap = false;

public String result;

public void getdata() {

Scanner input = new Scanner(System.in);

System.out.println();

System.out.println(" Leap Year Checker Using OOP");

System.out.println();

System.out.print("Enter Year : ");

year = input.nextInt();

}

public void checkyear() {

if(year % 4 == 0)

{

if( year % 100 == 0)

{

// year is divisible by 400, hence the year is a leap year

if ( year % 400 == 0)

leap = true;

else

leap = false;

}

else

leap = true;

}

else

leap = false;

if(leap)

result = year + " is a leap year.";

else

result = year + " is not a leap year.";

}

public void display() {

System.out.println();

System.out.println("===== DISPLAY RESULT =====");

System.out.println();

System.out.println(result);

System.out.println();

}

public static void main(String args[]) {

LeapYear year = new LeapYear();

year.getdata();

year.checkyear();

year.display();

}

Free Programming Source Codes and Computer Programming Tutorials

Monday, May 25, 2020

Hide and Show Effects in jQuery

Greet a Person Using jQuery

Greet a Person Using jQuery

Thursday, May 21, 2020

Ordered List in HTML

Unordered List in HTML

Forms in HTML

Image Gallery using HTML and CSS

Mouse Events Using AngularJS

Convert Vowels into Upper Case in C++

Wednesday, May 20, 2020

Greet a Person Using AngularJS

Greet a Person Using AngularJS

FadeOut Method in jQuery

FadeOut Method in jQuery

Addition of Three Numbers Using Subroutine in Perl

Reading Numbers from a Text File and removing leading zeros Using C++

Tuesday, May 19, 2020

FLM ARRESTED by NBI | Norman Mangusin - Francis Leo Marcos

"Uncle" Bob Martin - "The Future of Programming"

Monday, May 18, 2020

Product of Two in Java Using Getters and Setters in Java

Addition of Two Numbers Using OOP in Java

Leap Year Checker Using OOP in Java

Google Ads

Followers