[Web-Design] MapleTale [PSD]

ItzTechno · Apr 11, 2011

this is truley amazing, keep up the good work

maplefreak26 · Apr 11, 2011

str8killa said:
maplefreak code it your self
on the other hand i just finished coding the psd

Can't I ask?

Control said:
and Why are you wondering this? LOL How far others have gone is of their own business, not yours, theirs. Answering your question, I've just finished making the CSS file, and index page, doing JQuery + JS next.

The most annoying question you will hear today: U GONNA RELEASE IT? IF SO, WHEN?

404 · Apr 11, 2011

The plusses can be put there, by either creating OR seeking a "jQuery Accordion".

Here's an example:

To view the content, you need to sign in or register

There's a tutorial for that accordion, and of course it can be turned into the one like I've got on the preview. You would just have to slice Plus and Minus, and float it right. Also, if you look at the example, which I posted above, Those blue arrows, can be changed into the "News/Maintenance/Update" images..

Peace.

mertjuh · Apr 11, 2011

XxОsirisxX said:
Look at mertjuh comment, it says "hot..", it have no reason why it's hot. Same kind of comment, just, oppose taste. He doesn't like it, not everyone will like it... you have to deal with that. It's not a flame, it's just his opinion.

Hey don't use me as an example. :scared:
You can't say that this cms design is bad because it isn't, comparing to the others.

Lapje · Apr 11, 2011

Thanks Error, I've been looking for a design to sharpen my web coding skills and this one seems just perfect. This really saves me alot of time.

Thanks.

tonynguyenpro · Apr 11, 2011

Sorry Error 404, did my feedback make you angry? So, your design is so beautiful.................

GreekMaple · Apr 11, 2011

tonynguyenpro said:
Sorry Error 404, did my feedback make you angry? So, your design is so beautiful.................

It's the fact that you didn't state why it's ugly that got him/her angry/calling your post flame..

tonynguyenpro · Apr 11, 2011

Error 404 said:
You see, people like you push developers away. I've also said no flame. If you are saying its ugly, then there must be a reason. I also want to see you, design something. And by the way, I feel sorry for you, that you couldn't afford to pay for your "tonynguyenpro.com" domain. Bye now (;

That domain has expried 3 month ago. Now i'm using

To view the content, you need to sign in or register

Control · Apr 12, 2011

Samus. said:
I'm kinda curious how'ya did those plus/minus bars in CSS.

I'm doing those plus/minus bars w/ JQuery, not CSS LOL.

Kaynu · Apr 12, 2011

If anyone else doesn't like to use jQuery I made a little script to possibly help people code this release. Not as smooth as that jQuery Accordion but its ok...

PHP:

var current;
var delay = 20;
var padding = 6;
var prefix = 't-';
var button_prefix = 'b-';
var step = 5;
var working = false;

var status = new Array();
var heights = new Array();

function $(element) {
	return document.getElementById(element);
}

function start_small(id) {
	current = $(prefix + id);
	if (typeof heights[id] == 'undefined') {
		status[id] = false;
		heights[id] = current.offsetHeight - padding;
	}
	current.style.display = 'none';
	$(button_prefix + id).innerHTML = '+';
}

function setup() {
	start_small(3);
}

function toggle(id) {
	if (!working) {
		current = $(prefix + id);
		working = !working;
		if (typeof heights[id] == 'undefined') {
			status[id] = true;
			heights[id] = current.offsetHeight - padding;
		}
		status[id] = !status[id];
		if (!status[id]) {
			setTimeout('animate_collapse(' + heights[id] + ');', delay);
			$(button_prefix + id).innerHTML = '+';
		}
		else {
			setTimeout('animate_expand(0, ' + heights[id] + ');', delay);
			$(button_prefix + id).innerHTML = '-';
		}
	}
}

function animate_collapse(height) {
    if (height >= step) {
		current.style.height = (height - step) + 'px';
		setTimeout('animate_collapse("' + (height - step) + '");', delay);
	}
	else {
        current.style.display = "none";
		working = false;
	}
}

function animate_expand(height, max) {
	current.style.display = 'block';
    if ((height + step) <= max) {
		current.style.height = (height + step) + 'px'; 
		setTimeout('animate_expand(' + (height + step) + ', ' + max + ');', delay);
	}
	else {
		current.style.height = max + 'px';
		working = false;
	}
}

PHP:

<html>
	<head>
		<link
			type="text/css"
			rel="stylesheet"
			href="main.css"
		/>
		<script
			language="javascript"
			type="text/javascript"
			src="animate.js"
		></script>
	</head>
	<body onLoad="setup();">
		<div class="toggle_wrapper">
			<table class="head" cellspacing="0" cellpadding="0">
				<tr>
					<td>
						News
					</td>
					<td id="b-1" class="toggle_button" onClick="toggle(1);">
						-
					</td>
				</tr>
			</table>
			<div class="content" id="t-1">
				<div>
					content
					<br />
					content
				</div>
			</div>
		</div>
		<br />
		<div class="toggle_wrapper">
			<table class="head" cellspacing="0" cellpadding="0">
				<tr>
					<td>
						News
					</td>
					<td id="b-2" class="toggle_button" onClick="toggle(2);">
						-
					</td>
				</tr>
			</table>
			<div class="content" id="t-2">
				<div>
					content
					<br />
					content
					<br />
					content
				</div>
			</div>
		</div>
		<br />
		<div class="toggle_wrapper">
			<table class="head" cellspacing="0" cellpadding="0">
				<tr>
					<td>
						News
					</td>
					<td id="b-3" class="toggle_button" onClick="toggle(3);">
						+
					</td>
				</tr>
			</table>
			<div class="content" id="t-3">
				<div>
					hidden content already
				</div>
			</div>
		</div>
	</body>
</html>

PHP:

div.toggle_wrapper {
	border-color: #000000;
	border-style: solid;
	border-width: 1px;
	font-family: trebuchet ms;
	font-size: 12px;
	width: 200px;
}
div.toggle_wrapper table.head {
	background-color: #EEEEEE;
	font-size: 12px;
	width: 100%;
}
div.toggle_wrapper table.head td {
	padding: 3px;
}
div.toggle_wrapper table.head td.toggle_button {
	background-color: #CCCCCC;
	cursor: pointer;
	text-align: center;
	width: 20px;
}
div.toggle_wrapper div.content {
	background-color: #AABBCC;
    overflow: hidden;
	padding: 3px;
}

Control · Apr 12, 2011

Kaynu said:

If anyone else doesn't like to use jQuery I made a little script to possibly help people code this release. Not as smooth as that jQuery Accordion but its ok...

PHP:

var current;
var delay = 20;
var padding = 6;
var prefix = 't-';
var button_prefix = 'b-';
var step = 5;
var working = false;

var status = new Array();
var heights = new Array();

function $(element) {
	return document.getElementById(element);
}

function start_small(id) {
	current = $(prefix + id);
	if (typeof heights[id] == 'undefined') {
		status[id] = false;
		heights[id] = current.offsetHeight - padding;
	}
	current.style.display = 'none';
	$(button_prefix + id).innerHTML = '+';
}

function setup() {
	start_small(3);
}

function toggle(id) {
	if (!working) {
		current = $(prefix + id);
		working = !working;
		if (typeof heights[id] == 'undefined') {
			status[id] = true;
			heights[id] = current.offsetHeight - padding;
		}
		status[id] = !status[id];
		if (!status[id]) {
			setTimeout('animate_collapse(' + heights[id] + ');', delay);
			$(button_prefix + id).innerHTML = '+';
		}
		else {
			setTimeout('animate_expand(0, ' + heights[id] + ');', delay);
			$(button_prefix + id).innerHTML = '-';
		}
	}
}

function animate_collapse(height) {
    if (height >= step) {
		current.style.height = (height - step) + 'px';
		setTimeout('animate_collapse("' + (height - step) + '");', delay);
	}
	else {
        current.style.display = "none";
		working = false;
	}
}

function animate_expand(height, max) {
	current.style.display = 'block';
    if ((height + step) <= max) {
		current.style.height = (height + step) + 'px'; 
		setTimeout('animate_expand(' + (height + step) + ', ' + max + ');', delay);
	}
	else {
		current.style.height = max + 'px';
		working = false;
	}
}

PHP:

<html>
	<head>
		<link
			type="text/css"
			rel="stylesheet"
			href="main.css"
		/>
		<script
			language="javascript"
			type="text/javascript"
			src="animate.js"
		></script>
	</head>
	<body onLoad="setup();">
		<div class="toggle_wrapper">
			<table class="head" cellspacing="0" cellpadding="0">
				<tr>
					<td>
						News
					</td>
					<td id="b-1" class="toggle_button" onClick="toggle(1);">
						-
					</td>
				</tr>
			</table>
			<div class="content" id="t-1">
				<div>
					content
					<br />
					content
				</div>
			</div>
		</div>
		<br />
		<div class="toggle_wrapper">
			<table class="head" cellspacing="0" cellpadding="0">
				<tr>
					<td>
						News
					</td>
					<td id="b-2" class="toggle_button" onClick="toggle(2);">
						-
					</td>
				</tr>
			</table>
			<div class="content" id="t-2">
				<div>
					content
					<br />
					content
					<br />
					content
				</div>
			</div>
		</div>
		<br />
		<div class="toggle_wrapper">
			<table class="head" cellspacing="0" cellpadding="0">
				<tr>
					<td>
						News
					</td>
					<td id="b-3" class="toggle_button" onClick="toggle(3);">
						+
					</td>
				</tr>
			</table>
			<div class="content" id="t-3">
				<div>
					hidden content already
				</div>
			</div>
		</div>
	</body>
</html>

PHP:

div.toggle_wrapper {
	border-color: #000000;
	border-style: solid;
	border-width: 1px;
	font-family: trebuchet ms;
	font-size: 12px;
	width: 200px;
}
div.toggle_wrapper table.head {
	background-color: #EEEEEE;
	font-size: 12px;
	width: 100%;
}
div.toggle_wrapper table.head td {
	padding: 3px;
}
div.toggle_wrapper table.head td.toggle_button {
	background-color: #CCCCCC;
	cursor: pointer;
	text-align: center;
	width: 20px;
}
div.toggle_wrapper div.content {
	background-color: #AABBCC;
    overflow: hidden;
	padding: 3px;
}

Seriously? ._.

To view the content, you need to sign in or register

johnsmith14135 · Apr 12, 2011

tonynguyenpro said:
That domain has expried 3 month ago. Now i'm using
To view the content, you need to sign in or register

You hate MS? Why you make your domain is

To view the content, you need to sign in or register

?

tt1:

DjSlay · Apr 12, 2011

Nice design

Kaynu · Apr 12, 2011

Control said:
Seriously? ._.
To view the content, you need to sign in or register

Said I don't like to use jQuery, and some other people like to make their own scripts.

ItzTechno · Apr 12, 2011

i can't wait to see whats gonna happen next

iPain · Apr 14, 2011

Good Job Error

.

Xuraz · Apr 14, 2011

aww

I suck at CMS coding :O

Can anyone code this for me? Thanks

Control · Apr 14, 2011

Xuraz said:
aww I suck at CMS coding :O

Can anyone code this for me? Thanks

Got money? LOL. No one is going to do it for free.

Kaynu · Apr 15, 2011

Control said:
Got money? LOL. No one is going to do it for free.

I will if nobody else is planning on releasing it.

holthelper · Apr 15, 2011

Control said:
Got money? LOL. No one is going to do it for free.

some will beg to differ. yes there are going to be those that code and keep for themselves but look where we have gotten off free releases, so in due time someone will release a functioning CMS with this design.

[Web-Design] MapleTale [PSD]

Newbie Spellweaver

Divine Celestial

Error 404 / @Gdotcom

return null;

Ass > Tits

Junior Spellweaver

Newbie Spellweaver

Junior Spellweaver

Experienced Elementalist

Experienced Elementalist

Experienced Elementalist

Newbie Spellweaver

Newbie Spellweaver

Experienced Elementalist

Newbie Spellweaver

Newbie Spellweaver

Newbie Spellweaver

Experienced Elementalist

Experienced Elementalist

Infraction Baɴɴed

RaGEZONE Sponsor

About RaGEZONE

Forum Statistics

RaGEZONE Partners