Homehow to make this?
3 posters
Page 1 of 1
how to make this?
by akoe.akbar November 8th 2011, 7:22 am
hello,
how to make this images,
you can see the images in http://kingscrafters.com/
its moving picture
please help me,..
how to make this images,
you can see the images in http://kingscrafters.com/
its moving picture
please help me,..
akoe.akbar- Forumember
-
Posts : 251
Reputation : 4
Language : Bontang -
Re: how to make this?
by Poser November 8th 2011, 7:28 am
You can ask the graphic designers to make something like that for you.
Poser- Helper
- Posts : 413
Reputation : 43
Language : English, Filipino
Location : @ohmpawatt -
Re: how to make this?
by akoe.akbar November 8th 2011, 8:25 am
Johnny. wrote:You want the slider?
sure,.
akoe.akbar- Forumember
- Posts : 251
Reputation : 4
Language : Bontang -
Re: how to make this?
by Guest November 8th 2011, 9:23 am
This is the complete code:
- Code:
<head>
<style>
#banner {
margin:15px auto;
width:100%;
}
.slideshow {
height: 300.0px;
width:100%;
margin: 0 auto ;
}
.slideshow img {
padding: 0;
margin:0;
width:920px;
height:300.0px;
}
.slideshow a img { border:none }
.slideshowContainer {
display:block;
clear:both;
width:100%;
position:relative;
}
.slideshowBottom {
clear:both;
height:20px;
position:absolute;
top:280.0px;
width:920px;
z-index:10;
background:url('http://kingscrafters.com/images/css/slideshowBottom.png') no-repeat scroll center center transparent;
}
.slideshowLeftCorner {
height:10px;
position:absolute;
top:0;
left:0;
width:10px;
z-index:10;
background:url('http://kingscrafters.com/images/css/slideshowLeftCorner.png') no-repeat scroll center center transparent;
}
.slideshowRightCorner {
height:10px;
position:absolute;
top:0;
left:910px;
width:10px;
z-index:10;
background:url('http://kingscrafters.com/images/css/slideshowRightCorner.png') no-repeat scroll center center transparent;
}
</style>
<script type="text/javascript" language="javascript" src="http://kingscrafters.com/js/addon.js"></script>
<script type="text/javascript" language="javascript" src="http://kingscrafters.com/js/custom.js"></script
</head>
<center>
<div id="banner" class="slideshowContainer">
<!-- put your slideshow images here -->
<div class="slideshow">
<a href="#" title="Specs" target="_blank" shape="rect">
<img src="http://kingscrafters.com/images/stars.jpg" />
</a>
<a href="#" title="Plugins" target="_blank" shape="rect">
<img src="http://kingscrafters.com/images/psyrchus.jpg" />
</a>
<a href="#" title="KingsCraft" target="_blank" shape="rect">
<img src="http://kingscrafters.com/images/pseudoart.jpg" />
</a>
</div>
<div class="slideshowLeftCorner"></div>
<div class="slideshowRightCorner"></div>
<div class="slideshowBottom"></div>
</div>
</center>
Guest- Guest
Re: how to make this?
by akoe.akbar November 8th 2011, 9:58 am
Johnny. wrote:This is the complete code:
- Code:
<head>
<style>
#banner {
margin:15px auto;
width:100%;
}
.slideshow {
height: 300.0px;
width:100%;
margin: 0 auto ;
}
.slideshow img {
padding: 0;
margin:0;
width:920px;
height:300.0px;
}
.slideshow a img { border:none }
.slideshowContainer {
display:block;
clear:both;
width:100%;
position:relative;
}
.slideshowBottom {
clear:both;
height:20px;
position:absolute;
top:280.0px;
width:920px;
z-index:10;
background:url('http://kingscrafters.com/images/css/slideshowBottom.png') no-repeat scroll center center transparent;
}
.slideshowLeftCorner {
height:10px;
position:absolute;
top:0;
left:0;
width:10px;
z-index:10;
background:url('http://kingscrafters.com/images/css/slideshowLeftCorner.png') no-repeat scroll center center transparent;
}
.slideshowRightCorner {
height:10px;
position:absolute;
top:0;
left:910px;
width:10px;
z-index:10;
background:url('http://kingscrafters.com/images/css/slideshowRightCorner.png') no-repeat scroll center center transparent;
}
</style>
<script type="text/javascript" language="javascript" src="http://kingscrafters.com/js/addon.js"></script>
<script type="text/javascript" language="javascript" src="http://kingscrafters.com/js/custom.js"></script
</head>
<center>
<div id="banner" class="slideshowContainer">
<!-- put your slideshow images here -->
<div class="slideshow">
<a href="#" title="Specs" target="_blank" shape="rect">
<img src="http://kingscrafters.com/images/stars.jpg" />
</a>
<a href="#" title="Plugins" target="_blank" shape="rect">
<img src="http://kingscrafters.com/images/psyrchus.jpg" />
</a>
<a href="#" title="KingsCraft" target="_blank" shape="rect">
<img src="http://kingscrafters.com/images/pseudoart.jpg" />
</a>
</div>
<div class="slideshowLeftCorner"></div>
<div class="slideshowRightCorner"></div>
<div class="slideshowBottom"></div>
</div>
</center>
what is the background url?
akoe.akbar- Forumember
- Posts : 251
Reputation : 4
Language : Bontang -
Re: how to make this?
by akoe.akbar November 8th 2011, 10:01 am
Johnny. wrote:What background?
- CLICK:
.slideshowBottom {
clear:both;
height:20px;
position:absolute;
top:280.0px;
width:920px;
z-index:10;
background:url('http://kingscrafters.com/images/css/slideshowBottom.png') no-repeat scroll center center transparent;
}
.slideshowLeftCorner {
height:10px;
position:absolute;
top:0;
left:0;
width:10px;
z-index:10;
background:url('http://kingscrafters.com/images/css/slideshowLeftCorner.png') no-repeat scroll center center transparent;
}
.slideshowRightCorner {
height:10px;
position:absolute;
top:0;
left:910px;
width:10px;
z-index:10;
background:url('http://kingscrafters.com/images/css/slideshowRightCorner.png') no-repeat scroll center center transparent;
}
akoe.akbar- Forumember
- Posts : 251
Reputation : 4
Language : Bontang -
Re: how to make this?
by Guest November 8th 2011, 10:02 am
There are the backgrounds of border ( top - left; top - right and the main bottom background border )
Guest- Guest
Re: how to make this?
by akoe.akbar November 8th 2011, 10:05 am
Johnny. wrote:There are the backgrounds of border ( top - left; top - right and the main bottom background border )
the link is that?
akoe.akbar- Forumember
- Posts : 251
Reputation : 4
Language : Bontang -
Re: how to make this?
by Guest November 8th 2011, 10:08 am
Yes. If you delete the backgrounds, slider border will disappear.
Guest- Guest
Re: how to make this?
by akoe.akbar November 8th 2011, 10:12 am
Johnny. wrote:Yes. If you delete the backgrounds, slider border will disappear.
where i can add the code?
akoe.akbar- Forumember
- Posts : 251
Reputation : 4
Language : Bontang -
Re: how to make this?
by Guest November 8th 2011, 10:17 am
In to a HTML page, overall_header, overall_footer, index_body.
ACP > Display > Templates > General: overall_header, overall_footer, index_body.
ACP > Modules > HTML Pages administration > Create a new page.
ACP > Display > Templates > General: overall_header, overall_footer, index_body.
ACP > Modules > HTML Pages administration > Create a new page.
Guest- Guest
Re: how to make this?
by akoe.akbar November 8th 2011, 10:59 am
Johnny. wrote:In to a HTML page, overall_header, overall_footer, index_body.
ACP > Display > Templates > General: overall_header, overall_footer, index_body.
ACP > Modules > HTML Pages administration > Create a new page.
ok its solve, but its too big
i want to make it be header,.. how to make it?
akoe.akbar- Forumember
- Posts : 251
Reputation : 4
Language : Bontang -
Re: how to make this?
by tommycoo November 8th 2011, 11:49 am
can this code for invision ?Johnny. wrote:This is the complete code:
- Code:
<head>
<style>
#banner {
margin:15px auto;
width:100%;
}
.slideshow {
height: 300.0px;
width:100%;
margin: 0 auto ;
}
.slideshow img {
padding: 0;
margin:0;
width:920px;
height:300.0px;
}
.slideshow a img { border:none }
.slideshowContainer {
display:block;
clear:both;
width:100%;
position:relative;
}
.slideshowBottom {
clear:both;
height:20px;
position:absolute;
top:280.0px;
width:920px;
z-index:10;
background:url('http://kingscrafters.com/images/css/slideshowBottom.png') no-repeat scroll center center transparent;
}
.slideshowLeftCorner {
height:10px;
position:absolute;
top:0;
left:0;
width:10px;
z-index:10;
background:url('http://kingscrafters.com/images/css/slideshowLeftCorner.png') no-repeat scroll center center transparent;
}
.slideshowRightCorner {
height:10px;
position:absolute;
top:0;
left:910px;
width:10px;
z-index:10;
background:url('http://kingscrafters.com/images/css/slideshowRightCorner.png') no-repeat scroll center center transparent;
}
</style>
<script type="text/javascript" language="javascript" src="http://kingscrafters.com/js/addon.js"></script>
<script type="text/javascript" language="javascript" src="http://kingscrafters.com/js/custom.js"></script
</head>
<center>
<div id="banner" class="slideshowContainer">
<!-- put your slideshow images here -->
<div class="slideshow">
<a href="#" title="Specs" target="_blank" shape="rect">
<img src="http://kingscrafters.com/images/stars.jpg" />
</a>
<a href="#" title="Plugins" target="_blank" shape="rect">
<img src="http://kingscrafters.com/images/psyrchus.jpg" />
</a>
<a href="#" title="KingsCraft" target="_blank" shape="rect">
<img src="http://kingscrafters.com/images/pseudoart.jpg" />
</a>
</div>
<div class="slideshowLeftCorner"></div>
<div class="slideshowRightCorner"></div>
<div class="slideshowBottom"></div>
</div>
</center>
tommycoo- Forumember
- Posts : 615
Reputation : 9
Language : Indonesia -
Re: how to make this?
by akoe.akbar November 8th 2011, 12:00 pm
tommycoo wrote:can this code for invision ?Johnny. wrote:This is the complete code:
- Code:
<head>
<style>
#banner {
margin:15px auto;
width:100%;
}
.slideshow {
height: 300.0px;
width:100%;
margin: 0 auto ;
}
.slideshow img {
padding: 0;
margin:0;
width:920px;
height:300.0px;
}
.slideshow a img { border:none }
.slideshowContainer {
display:block;
clear:both;
width:100%;
position:relative;
}
.slideshowBottom {
clear:both;
height:20px;
position:absolute;
top:280.0px;
width:920px;
z-index:10;
background:url('http://kingscrafters.com/images/css/slideshowBottom.png') no-repeat scroll center center transparent;
}
.slideshowLeftCorner {
height:10px;
position:absolute;
top:0;
left:0;
width:10px;
z-index:10;
background:url('http://kingscrafters.com/images/css/slideshowLeftCorner.png') no-repeat scroll center center transparent;
}
.slideshowRightCorner {
height:10px;
position:absolute;
top:0;
left:910px;
width:10px;
z-index:10;
background:url('http://kingscrafters.com/images/css/slideshowRightCorner.png') no-repeat scroll center center transparent;
}
</style>
<script type="text/javascript" language="javascript" src="http://kingscrafters.com/js/addon.js"></script>
<script type="text/javascript" language="javascript" src="http://kingscrafters.com/js/custom.js"></script
</head>
<center>
<div id="banner" class="slideshowContainer">
<!-- put your slideshow images here -->
<div class="slideshow">
<a href="#" title="Specs" target="_blank" shape="rect">
<img src="http://kingscrafters.com/images/stars.jpg" />
</a>
<a href="#" title="Plugins" target="_blank" shape="rect">
<img src="http://kingscrafters.com/images/psyrchus.jpg" />
</a>
<a href="#" title="KingsCraft" target="_blank" shape="rect">
<img src="http://kingscrafters.com/images/pseudoart.jpg" />
</a>
</div>
<div class="slideshowLeftCorner"></div>
<div class="slideshowRightCorner"></div>
<div class="slideshowBottom"></div>
</div>
</center>
yes, i use it already
akoe.akbar- Forumember
- Posts : 251
Reputation : 4
Language : Bontang -
Re: how to make this?
by Guest November 8th 2011, 6:23 pm
You you how to use them, you can make it for all versions.
So, you need more help?
So, you need more help?
Guest- Guest
Similar topics» How do you make pictures of your choice float down the screen? And, how do you make the gender signs?
» Is there a way to make it so a member must make a post in order to unlock the forum?
» Make a border around avatars, and make the texteditor-buttons larger
» how to make a user make atleast one post before they can log out(read the whole thread plz)
» i make group global moderator, he cant make sticky post - why?
» Is there a way to make it so a member must make a post in order to unlock the forum?
» Make a border around avatars, and make the texteditor-buttons larger
» how to make a user make atleast one post before they can log out(read the whole thread plz)
» i make group global moderator, he cant make sticky post - why?
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum
Facebook
Twitter
Pinterest
Youtube
