Creating a simple Manga Site

I am using the  manga WORKING. This is the output of this project




For this tutorial you need to know :
- HTML
- CSS
- Javascirpts

To download this full project Click Me

FIRST STEP:
Lets start with our HTML code. Open your notepad or dreamweaver and paste this code below. 

<html>
<head>
<title> Working </title>
<style type="text/css">

body{
background-color:#e8e8e8;
background: url(images/bg.png);
}

div#main{
background:#ffffff;
width: 900px;
height: 1582px;
box-shadow: 0 0 3px 3px #888;
}

div#cover{
background: url(images/head.jpg);
height:506;
border: 4px solid #ffffff;
}

div#home{
background:url(images/home.jpg);
height:1032px;
margin-top:508px;

}

div#down{
background: url(images/down.jpg);
width:892px;
height:38;
margin-top:90px;
margin-left:0px;
}

.button-link {
    font-family:Arial;
    text-decoration:none;
    padding: 10px 15px;
    background: #E4287C;
    color: #FFF;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border: solid 2px #ffffff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    -webkit-transition-duration: 0.2s;
    -moz-transition-duration: 0.2s;
    transition-duration: 0.2s;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
}
.button-link:hover {
    background: #b85768;
    border: solid 1px #ffffff;
    text-decoration: none;
}
.button-link:active {
    -webkit-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
    -moz-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
    box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
    background:  #b85768;
    border: solid 1px #ffffff;
}



</style>
</head>


<body>
<center>
<div id="main">
<div id="cover">
<div id="home">

<a class="button-link" href="Chapters/Episodes/1.html" style="vertical-align:-935px;"> Read Manga Now!</a>

<div id="down">


</div>

</center>
</body>
</html>

save this file as index.html . Then create a new folder *name it any name you want, for example in my case, I name my folder as Working.

Read more »

Gene Tuesday, April 30, 2013 8 comments
Labels: , ,

Simple Calculator Program using Microsoft Visual Basic

Here is the output of our simple calculator:


Here's the code:

Dim a, b, r As Integer
Dim opr As String

Private Sub add_Click()
a = Val(Text.Text)
opr = "+"
Text.Text = ""
End Sub

Private Sub clear_Click()
Me.Text.Text = " "

End Sub

Private Sub divide_Click()
a = Val(Text.Text)
opr = "/"
Text.Text = ""
End Sub

Private Sub equals_Click()
b = Val(Text.Text)
Select Case opr
Case "+": Text.Text = a + b
Case "-": Text.Text = a - b
Case "*": Text.Text = a * b
Case "/": Text.Text = a / b
End Select
End Sub

Private Sub Form_Load()

End Sub

Private Sub multiply_Click()
a = Val(Text.Text)
opr = "*"
Text.Text = ""
End Sub

Private Sub subtract_Click()
a = Val(Text.Text)
opr = "-"
Text.Text = ""
End Sub


Gene Thursday, August 30, 2012 6 comments
Labels:

How to Add Social Icons on Blogger


Adding social icons on your site it's so easy just follow this steps.

Step 1: You can customize or select your own social icons any design  that you like you can visit this site for reference Click Me.

Step 2: After selecting the desired icon/design, If you have a photobucket account just simple go there and upload your photo/design icon to get the code.

Copy the DIRECT LINK only

Step 3:  Copy this code and replace the YOUR LINK HERE to your SITE or links you want to visit example, https://www.facebook.com/ and DIRECT LINK to your code on photobucket. 

<a href="YOUR LINK HERE"><img src="DIRECT LINK OF YOUR PHOTO" /></a>

<a href="YOUR LINK HERE"><img src="DIRECT LINK OF YOUR PHOTO" /></a>

<a href="YOUR LINK HERE"><img src="DIRECT LINK OF YOUR PHOTO" /></a>

<a href="YOUR LINK HERE"><img src="DIRECT LINK OF YOUR PHOTO" /></a>


Read more »

Gene Tuesday, August 28, 2012 3 comments
Labels:

Color Program

The user should input this following letter:

if Y the result should be YELLOW,  if R the result should be RED,  if W the result should be WHITE, if V the result should be VIOLET, if P the result should be PINK, if the user will input none of those letter ten the output should be "NO COLOR AVAILABLE!"

Code:


Here's the code:

package color;
import java.util.Scanner;

public class Color {
static Scanner console=new Scanner(System.in);
    public static void main(String[] args) {
       
         String input; char letter;
        System.out.println("Enter a letter:");
        input=console.next();
        letter=input.charAt(0);
        
        switch (letter){
            case'y':case'Y':System.out.println("Yellow");break;
            case'r':case'R':System.out.println("Red");break;
            case'w':case'W':System.out.println("White");break;
            case'v':case'V':System.out.println("Violet");break;
            case'p':case'P':System.out.println("Pink");break;    
            default:System.out.println("NO COLOR AVAILABLE!");break;      
        }
      
    }
}


Gene 0 comments
Labels:
Subscribe to: Posts ( Atom )
 
My IT Life © 2011-2014|Gene Rose