Home
Technical Details
Forum version : #phpBB2
Position : Founder
Concerned browser(s) : Google Chrome
Who the problem concerns : Yourself
Forum link : ( link is hidden, you must reply to see )
Description of problem
Hello!So I was messing around with the basic profile template. In the end you can find my basic code and JQ.
Selecting ".profilioTab3" the element ".profilioTabContent" disappears as intended and appear again when the element is toggled again. selecting ".profilioTab4" the element ".profilioTabContent" disappears as intended and appear again when the element is toggled again.
ISSUE: selecting ".profilioTab4" after ".profilioTab3" (and vs versa) the element ".profilioTabContent" appears as it was disabled by firstly selected element. Any ideas how to resolve it?
I feel like an IF would resolve it, but I am not sure and dunno how to check for example if .profilioTabContent is visible or not and hide it if needed.....
JQ:
- Code:
$(document).ready(function(){
$(".profilioT1, .profilioT2, .profilioT3, .profilioT4").css("display", "none");
$(".profilioTab1").click(function(){
$(".profilioTabContent").css("display", "block");
$(".profilioT1").fadeToggle("slow", "linear");
$(".profilioT2, .profilioT3, .profilioT4").css("display", "none");
});
});
$(document).ready(function(){
$(".profilioTab2").click(function(){
$(".profilioTabContent").css("display", "block");
$(".profilioT2").fadeToggle("slow", "linear");
$(".profilioT1, .profilioT3, .profilioT4").css("display", "none");
});
});
$(document).ready(function(){
$(".profilioTab3").click(function(){
$(".profilioT3").fadeToggle("slow", "linear");
$(".profilioTabContent").toggle("slow", "linear");
$(".profilioT1, .profilioT2, .profilioT4").css("display", "none");
});
});
$(document).ready(function(){
$(".profilioTab4").click(function(){
$(".profilioT4").fadeToggle("slow", "linear");
$(".profilioTabContent").toggle("slow", "linear");
$(".profilioT1, .profilioT2, .profilioT3").css("display", "none");
});
});
Code:
- Code:
<center>
<link href="http://fonts.googleapis.com/css?family=Allura" rel="stylesheet" type="text/css" />
<img src="http://i.solidfiles.net/e7927d2708.png" style="border-radius: 0px!important;" />
<div class="profilioTitle" id="profilioTitle">{L_VIEWING_PROFILE}</div><script type="text/javascript">document.getElementById('profilioTitle').innerHTML=document.getElementById('profilioTitle').innerHTML.replace(/::/,"<br/>"); </script>
<div class="profilioContent profilioText">
<br/><br/>
<div class="profilioTab1">Trumpai</div>
<div class="profilioTab2">Susisiek su manimi</div>
<div class="profilioTabContent">
<div class="profilioT1">
<div style="float: left; padding-left: 20px; padding-right: 5px;">
<div style="width: 115px; height: 150px; overflow: hidden; border-radius: 5px; border: 4px double white;">{AVATAR_IMG}</div>
</div>
<div style="text-align: left;">
{POSTER_RANK} Statusas: <b>{USER_ONLINE}</b><br/>
Paskutinį kartą lankėsi: <b><span class="lastpostText">{LAST_VISIT_TIME}</span></b><br/>
Gautų pelėdų skaičius: <b>{PRIVATE_MSG}</b><br/>
Administruoti vartotoją: <b>{ADMINISTRATE_USER} {BAN_USER}</b><br/>
</div>
</div>
<div class="profilioT2">
{contact_field.CONTENT}
<table width="100%" border="0" cellspacing="1" cellpadding="0">
<!-- BEGIN contact_field -->
<tr id="field_id{contact_field.ID}">
<td width="40%" align="right" valign="middle" nowrap="nowrap"><span class="gen">{contact_field.LABEL} </span></td>
<td width="60%" valign="middle"><div class="gen" style="font-weight:bold;">{contact_field.CONTENT}</div></td>
</tr>
<!-- END contact_field -->
<!-- BEGIN switch_admin_user_comment_active -->
<tr>
<td align="right" valign="middle" nowrap="nowrap" width="50%">
<span class="gen">c{L_COMMENTS} :</span><br />
<span class="gensmall">{L_MODS_AND_ADMINS}</span>
</td>
<td class="row1" valign="middle">
<table align="center">
<tr>
<td>xxx {ADMIN_USER_COMMENT}</td>
</tr>
</table>
</td>
</tr>
<!-- END switch_admin_user_comment_active -->
</table>
</div>
<div id="profilioRPGimg">{RPG_IMAGE}</div><script type="text/javascript">document.getElementById('profilioRPGimg').innerHTML=document.getElementById('profilioRPGimg').innerHTML.replace(/<br>/," ");</script>
</div>
<div class="profilioT3 onscr">
<br/>
<table border="0" cellspacing="1" cellpadding="0">
<!-- BEGIN profile_field -->
<tr id="field_id{profile_field.ID}">
<td width="150px" align="right" valign="top" nowrap="nowrap">
<span class="gen">{profile_field.LABEL} </span>
</td>
<td width="335px">
<div class="gen" style="font-weight:bold;">{profile_field.CONTENT}</div><br />
<!-- BEGIN profil_type_user_posts -->
<span class="genmed">[{POST_PERCENT_STATS} / {POST_DAY_STATS}]</span><br />
<span class="genmed">
<a rel="nofollow" class="genmed" href="/st/{PUSERNAME}">{L_SEARCH_USER_POSTS} :</a><br />
- <a rel="nofollow" class="genmed" href="/sta/{PUSERNAME}">{L_TOPICS}</a><br />
- <a rel="nofollow" class="genmed" href="/spa/{PUSERNAME}">{L_POSTS}</a><br />
</span>
<!-- END profil_type_user_posts -->
</td>
</tr>
<!-- END profile_field -->
</table>
<br/>
</div>
<div class="profilioT4 onscr profilioTextField">
<center style="color: black;"><b>IRL {in real life}</b></center>
<table width="100%" height="100%" border="0" cellspacing="1" cellpadding="0" align="center">
<!-- BEGIN switch_rpg -->
<!--<tr>
<td class="catLeft" align="center"><b><span class="gen">{L_VIEWING_RPG}</span></b></td>
</tr>-->
<tr>
<td height="100%" class="row1" align="center" valign="top" height="6">
<table width="100%" border="0" cellspacing="1" cellpadding="0">
<!-- BEGIN rpg_fields_left -->
<tr>
<td align="right" valign="top" nowrap="nowrap">
<span class="gen">{switch_rpg.rpg_fields_left.F_NAME}: </span>
</td>
<td width="335px" valign="middle" nowrap="nowrap">
<span class="gen"><b>{switch_rpg.rpg_fields_left.F_VALUE_NEW}</b></span><br/><br/>
</td>
</tr>
<!-- END rpg_fields_left -->
</table>
<table width="100%" border="0" cellspacing="1" cellpadding="0">
<!-- BEGIN rpg_fields -->
<tr>
<td align="right" valign="top" nowrap="nowrap">
<span class="gen">{switch_rpg.rpg_fields.F_NAME}: </span>
</td>
<td width="335px" height="100%" valign="middle" valign="baseline">
<span class="gen"><b>{switch_rpg.rpg_fields.F_VALUE_NEW}</b></span><br/><br/>
</td>
</tr>
<!-- END rpg_fields -->
</table>
</td>
</tr>
<tr>
<td colspan="2" align="center" class="row1">
{U_ADMIN_RPG}
</td>
</tr>
<!-- END switch_rpg -->
<tr>
<td colspan="2" align="center" class="row1">
<div style="height: 30px;"></div>
</td>
</tr>
</table>
<br/><br/>
</div>
<div class="profilioTab3">Personažo aprašymas</div>
<div class="profilioTab4">Tikrasis veidas</div></div>
<img src="http://i.solidfiles.net/9c7af1523d.png" style="border-radius: 0px!important;"/>
</center>
Last edited by Kami-sama on December 23rd 2016, 12:40 am; edited 2 times in total
