Social Links (Rework) Help
3 posters
Page 1 of 1
Social Links (Rework) Help
So I was following the tutorial provided by @DadyKing regarding his "Touch Social Buttons" post.
I was attempting to rework the code so that it may better fit an RPG style forum.
As instructed in the original post by DadyKing I added the codes to the forum (both HTML/CSS)
This is the code that I was rewrote for both portions
CSS
HTML
Now as you can see I derived quite a bit from the original code, and added a newbackground image for the tabs that would open when hovered to the following
Below is my OVERALL_FOOTER_END template
I am unsure if anyone would have a fix for this, but you guys have been great help to my issues before!
Thank you for taking the time to look into my issue!
FORUM VERSION: phpbb3
FORUM LINK: http://www.fukitsuna.com/
I was attempting to rework the code so that it may better fit an RPG style forum.
As instructed in the original post by DadyKing I added the codes to the forum (both HTML/CSS)
This is the code that I was rewrote for both portions
CSS
- Code:
#takip {
position: fixed;
right: 0;
top: 220px;
z-index: 999;
}
.takip {
background-image: url('http://i1381.photobucket.com/albums/ah235/FluxCannonShoe/sidebar%20clan%20popout%20images/clancollectionsidebar_zpspdxj4wek.png');
background-repeat: no-repeat;
height: 42px;
width: 42px;
top: 100px;
margin-left: auto;
opacity:0.3;
filter:alpha(opacity=50); /* For IE8 and earlier */
}
.takip:hover {
background-image: url('http://i1381.photobucket.com/albums/ah235/FluxCannonShoe/sidebar%20clan%20popout%20images/clancollectionsidebar_zpspdxj4wek.png');
cursor: pointer;
opacity:1;
filter:alpha(opacity=100); /* For IE8 and earlier */
}
.mako {
background-position: 0px 0px;
}
.nattori {
background-position: 0px -42px;
}
.matisyahu {
background-position: 0px -84px;
}
.yoshimato {
background-position: 0px -126px;
}
.hiro {
background-position: 0px -168px;
}
.chosokabe {
background-position: 0px -210px;
}
.satake {
background-position: 0px -252px;
}
.mecco {
background-position: 0px -264px;
}
HTML
- Code:
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>Social Media Buttons</title>
<script src="dkthemes.forumotions.in/38797.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".takip").mouseover(function(){
$(this).filter(':not(:animated)').animate({width:135},{duration:500});
});
$(".takip").mouseout(function(){
$(this).animate({width:42});
});
});
</script>
<div id="takip">
<div class="mako" onclick="location.href='http://www.fukitsuna.com/f54-mako-clan'">
</div>
<div class="nattori" onclick="location.href='http://www.fukitsuna.com/f55-nattori-clan'">
</div>
<div class="matisyahu" onclick="location.href='http://www.fukitsuna.com/f56-matisyahu-clan'">
</div>
<div class="yoshimato" onclick="location.href='http://www.fukitsuna.com/f57-yoshimato-clan'">
</div>
<div class="hiro" onclick="location.href='http://www.fukitsuna.com/f58-hiro-clan'">
</div>
<div class="chosokabe" onclick="location.href='http://www.fukitsuna.com/f59-chosokabe-clan'">
</div>
<div class="satake" onclick="location.href='http://www.fukitsuna.com/f60-satake-clan'">
</div>
<div class="mecco" onclick="location.href='http://www.fukitsuna.com/f61-mecco-clan'">
</div>
Now as you can see I derived quite a bit from the original code, and added a newbackground image for the tabs that would open when hovered to the following
Below is my OVERALL_FOOTER_END template
- Code:
<!-- BEGIN html_validation -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<body>
<div>
<div>
<div>
<div>
<div>
<div>
<div>
<ul>
<li>
<!-- END html_validation -->
</li>
</ul>
<!-- BEGIN switch_footer_links -->
<ul class="linklist clearfix">
<li class="rightside">
<!-- BEGIN footer_link -->
<!-- BEGIN switch_separator --> | <!-- END switch_separator -->
{switch_footer_links.footer_link.FOOTER_LINK_SEPARATOR}<a name="bottom" class="copyright" href="{switch_footer_links.footer_link.U_FOOTER_LINK_HREF}" rel="{switch_footer_links.footer_link.FOOTER_LINK_REL}" target="{switch_footer_links.footer_link.FOOTER_LINK_TARGET}" title="{switch_footer_links.footer_link.L_FOOTER_LINK_TITLE}">{switch_footer_links.footer_link.L_FOOTER_LINK_TEXT}</a>
<!-- END footer_link -->
</li>
</ul>
<!-- END switch_footer_links -->
<span class="corners-bottom"><span></span></span>
</div>
</div>
<p class="copyright">
<strong>{ADMIN_LINK}</strong>
</p>
</div>
{PROTECT_FOOTER}
</div>
</div>
</div>
</div>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>Social Media Buttons</title>
<script src="dkthemes.forumotions.in/38797.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".takip").mouseover(function(){
$(this).filter(':not(:animated)').animate({width:135},{duration:500});
});
$(".takip").mouseout(function(){
$(this).animate({width:42});
});
});
</script>
<div id="takip">
<div class="mako" onclick="location.href='http://www.fukitsuna.com/f54-mako-clan'">
</div>
<div class="nattori" onclick="location.href='http://www.fukitsuna.com/f55-nattori-clan'">
</div>
<div class="matisyahu" onclick="location.href='http://www.fukitsuna.com/f56-matisyahu-clan'">
</div>
<div class="yoshimato" onclick="location.href='http://www.fukitsuna.com/f57-yoshimato-clan'">
</div>
<div class="hiro" onclick="location.href='http://www.fukitsuna.com/f58-hiro-clan'">
</div>
<div class="chosokabe" onclick="location.href='http://www.fukitsuna.com/f59-chosokabe-clan'">
</div>
<div class="satake" onclick="location.href='http://www.fukitsuna.com/f60-satake-clan'">
</div>
<div class="mecco" onclick="location.href='http://www.fukitsuna.com/f61-mecco-clan'">
</div>
<!-- BEGIN switch_facebook_login -->
<div id="fb-root"></div>
<script type="text/javascript">
FB.init({
appId : {switch_facebook_login.FACEBOOK_APP_ID},
cookie : true,
xfbml : true,
oauth : true,
version : 'v2.3'
});
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<!-- END switch_facebook_login -->
<!-- BEGIN switch_facebook_logout_TMP -->
<script type="text/javascript">
//<![CDATA[
FB.Event.subscribe('auth.logout', function(response) {
if ($('a#logout'))
{
var lien_redir = $('a#logout').attr('href');
if ($('a#logout').attr('href') && $('a#logout').attr('href') != '')
{
document.location.href = 'http://{switch_facebook_logout.SERVER_NAME}/' + lien_redir;
}
}
});
$(document).ready( function() {
$('a#logout').click( function() {
FB.logout();
} );
} );
//]]>
</script>
<!-- END switch_facebook_logout_TMP -->
<script type="text/javascript">
//<![CDATA[
fa_endpage();
//]]>
</script>
</body>
</html>
I am unsure if anyone would have a fix for this, but you guys have been great help to my issues before!
Thank you for taking the time to look into my issue!
FORUM VERSION: phpbb3
FORUM LINK: http://www.fukitsuna.com/
Re: Social Links (Rework) Help
Sir. Mayo wrote:What exactly is the issue? What are you trying to do?
With the image I provided (With the clan names)
I was trying to make it work like the Social Links, when you hover they become visible on screen.
I messed with the code and added as instructed from the tutorial thread.
Though when adding the code and altering it, it seems broken and only displays the first image.
Re: Social Links (Rework) Help
Is this the forum: http://www.fukitsuna.com/ ?
I need to inform you that you are breaking the Terms of Service by hiding the footer links: forum version copyright, report an abuse, etc.
I need to inform you that you are breaking the Terms of Service by hiding the footer links: forum version copyright, report an abuse, etc.
Lost Founder's Password |Forum's Utilities |Report a Forum |General Rules |FAQ |Tricks & Tips
You need one post to send a PM.
You need one post to send a PM.
When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
Re: Social Links (Rework) Help
Yes, that is our domain link.
I do apolgize. I was not aware I had altered anything that was a violoation of any rules. Ill be sure to have the footer set back to default.
I had purchased the copyright portion with credits as well, im unsure if that had altered anything! D:
EDIT: the OVERALL_FOOTER_END template has been reset to default. I do apologize for any inconvenience regarding violation of terms and agreements.
EDIT 2: Links of VERSION/STATS/CONTACT/ABUSE are visible, just our background and font color make it difficult to see. If there is a way I could box said links so that they may be more visible, I would certainly do so!
I do apolgize. I was not aware I had altered anything that was a violoation of any rules. Ill be sure to have the footer set back to default.
I had purchased the copyright portion with credits as well, im unsure if that had altered anything! D:
EDIT: the OVERALL_FOOTER_END template has been reset to default. I do apologize for any inconvenience regarding violation of terms and agreements.
EDIT 2: Links of VERSION/STATS/CONTACT/ABUSE are visible, just our background and font color make it difficult to see. If there is a way I could box said links so that they may be more visible, I would certainly do so!
Similar topics
» social network links
» social network links
» Footer links, forumotion links and getting banned
» Rework Forum Permissions Control
» Multi forums in one problem: Get links to look like regular forum links
» social network links
» Footer links, forumotion links and getting banned
» Rework Forum Permissions Control
» Multi forums in one problem: Get links to look like regular forum links
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum