[FOORUM] Profile popup

Vaata eelmist teemat Vaata järgmist teemat Go down

flammable
flammable

Liitus : 17/08/2014
Postitusi : 1600

Postitamineflammable 02.07.15 14:33

Lõpp tulemus:
[FOORUM] Profile popup Captur17

Alustuseks:

♦️ Loome javascripti
Administration Panel > Modules > JavaScript Codes Management
Pealkiri: Profile popup
Koht: All pages
Javascript:
Kood:
$(function () {
  if (/\/u\d+/.test(location.pathname)) return;
 
  var wall = 1, // visitor messages tab
  stats = 1, // statistics tab
  attachments = 0, // attachments tab
  friends = 1, // friends tab
  contact = 1, // contact tab
  rpg = 0, // RPG tab
  close = 1, // close popup button
  avatar = 1; // display user avatar
 
  var a=document.getElementsByTagName('A');
  for(i=0;i<a.length;i++)if(/\/u\d+/.test(a[i].href))a[i].className=a[i].className+' profilePopup';
  $('.profilePopup:has(img)').removeClass('profilePopup');
  
  var userWall='',userStats='',userAttachments='',userFriends='',userContact='',userRpg='',userClose='',guestView=true;
  if(wall==1)userWall='<span class="propop_tab" id="propop_vm">Visitor messages</span>';if(stats==1)userStats='<span class="propop_tab" id="propop_stats">Statistics</span>';if(attachments==1)userAttachments='<span class="propop_tab" id="propop_attach">Attachments</span>';if(friends==1)userFriends='<span class="propop_tab" id="propop_friends">Friends</span>';if(contact==1)userContact='<span class="propop_tab" id="propop_contact">Contact</span>';if(rpg==1)userRpg='<span class="propop_tab" id="propop_rpg">Character sheet</span>';if(close==1)userClose='<span class="propop_tab" id="close_popup" style="float:right;margin-top:-4px;">Close</span>';
 
  $('.profilePopup').click(function(){
    var UID=$(this).attr('href'),UNM=$(this).text(),SEL='#cp-main .panel, .forumline:has(#profile-advanced-details), .clear + #profile-advanced-details',LOAD='<div class="profileLoading" style="text-align:center;font-weight:bold;font-size:18px;">Loading...</div>';
    $('body').append('<div id="profilefilter" style="position:fixed;top:0px;left:0px;right:0px;bottom:0px;background:url(http://i39.servimg.com/u/f39/18/21/41/30/overla10.png);cursor:pointer;z-index:10;"></div><div id="profcont-container" style="background:#EEE;border:1px solid #CCC;top:20%;left:15%;right:15%;padding:4px;position:fixed;font-size:12px;border-radius:5px;z-index:50;"><div class="profile_popup_nav">'+userWall+'<span class="propop_tab" id="propop_profile">Profile</span>'+userStats+userAttachments+userFriends+userContact+userRpg+userClose+'</div><a href="'+UID+'"><div id="userAVA"></div></a><div id="userprofile" style="height:400px;overflow-y:auto;">'+LOAD+'</div><span id="profileLinks"><a href="'+UID+'">View Profile</a><span id="interactionLinks"> • <a href="/privmsg?mode=post&u='+UID.replace(/.*?\/u/,'')+'">Send PM</a><span id="vmLink"> • <a href="/privmsg?mode=post_profile&u='+UID.replace(/.*?\/u/,'')+'">Send VM</a></span><span style="float:right;"><a href="/profile?friend='+UNM.replace(/\s+/g,'+')+'&mode=editprofile&page_profil=friendsfoes">Add Friend</a> • <a href="/profile?foe='+UNM.replace(/\s+/g,'+')+'&mode=editprofile&page_profil=friendsfoes">Add Foe</a></span></span></div>');

    $('#userprofile').load(UID+SEL,function(){if($('#profcont-container #username').length&&_userdata.user_id==-1){$(this).html('<div class="profileLoading" style="text-align:center;font-weight:bold;font-size:18px;">Sorry, guests cannot view the profiles! :(</div>');guestView=false}});
    $('#propop_profile').addClass('activeTab');
    if (avatar == 1) $('#userAVA').load(UID+' #profile-advanced-right .module:first div img:first, .forumline td.row1.gensmall:first > img:first, .frm-set.profile-view.left dd img:first, dl.left-box.details:first dd img:first, .row1 b .gen:first img:first, .real_avatar img:first');
    loadPro('#propop_profile','');loadPro('#propop_vm','wall');loadPro('#propop_stats','stats');loadPro('#propop_friends','friends');loadPro('#propop_contact','contact');loadPro('#propop_rpg','rpg');loadPro('#propop_attach','attachments');
  
    if(wall==0)$('#vmLink').remove();
    if(!document.getElementById('logout'))$('#interactionLinks').remove();
    $('#profilefilter,#close_popup').click(function(){$('#profilefilter, #profcont-container').remove()});
    function loadPro(element, location){$(element).click(function(){if($(this).hasClass('activeTab')||guestView==false)return;$('#propop_profile,#propop_vm,#propop_stats,#propop_friends,#propop_contact,#propop_rpg,#propop_attach,#propop_close').removeClass('activeTab');$(this).addClass('activeTab');$('#userprofile').html(LOAD).load(UID+location+SEL)})}
    return false;
  });
});


♦️ ♦️  Nüüd Loome CSS STYLESHEET
Mine administratsioonpaneeli | Display | Colors | CSS stiilifail

Kood:
/* Profile popup */
#profcont-container {
    background:#EEE !important;
    border:1px solid #CCC !important;
}

#userAVA img{
    position:absolute;
    top:43px;
    right:30px;
    height:50px;
    width:50px;
}

.profile_popup_nav {
    background:#E0E0E0;
    margin:-4px -4px 10px -4px;
    padding:3px;
    padding-top:10px !important;
    height:auto;
    border-bottom:1px solid #CCC;
    -webkit-border-radius:5px 5px 0px 0px;
    -moz-border-radius:5px 5px 0px 0px;
    border-radius:5px 5px 0px 0px;
}

.propop_tab {
    color:#888;
    text-shadow:1px 1px 0 #F5F5F5;
    cursor:pointer;
    -webkit-border-radius:4px 4px 0px 0px;
      -moz-border-radius:4px 4px 0px 0px;
            border-radius:4px 4px 0px 0px;
    border:1px solid #CCC;
    border-bottom:none;
    -webkit-box-shadow:0px 10px 6px rgba(255,255,255, 0.5) inset;
      -moz-box-shadow:0px 10px 6px rgba(255,255,255, 0.5) inset;
            box-shadow:0px 10px 6px rgba(255,255,255, 0.5) inset;
    background:#DDD;
    margin:0 2px;
    padding:3px;
}

.propop_tab:hover {
    position:relative;
    top:1px;
    color:#666;
    text-shadow:none;
    background-color:#EEE;
}

.propop_tab.activeTab {
    position:relative;
    top:1px;
    color:#666;
    text-shadow:none !important;
    background-color:#EEE !important;
}

#profileLinks {
    background:#E0E0E0;
    display:block;
    padding:3px;
    margin:10px -4px -4px -4px;
    border-top:1px solid #CCC;
    -webkit-border-radius:0px 0px 5px 5px;
    -moz-border-radius:0px 0px 5px 5px;
    border-radius:0px 0px 5px 5px;
}


Viimati muutis seda flammable (13.02.16 23:53). Kokku muudetud 1 kord
Tonight
Tonight

[FOORUM] Profile popup Vetera11
Liitus : 19/02/2012
Postitusi : 18000

PostitamineTonight 02.07.15 16:20

Eestikeelne versioon:
Kood:
$(function () {
      if (/\/u\d+/.test(location.pathname)) return;
   
      var wall = 1, // visitor messages tab
      stats = 1, // statistics tab
      attachments = 0, // attachments tab
      friends = 1, // friends tab
      contact = 1, // contact tab
      rpg = 0, // RPG tab
      close = 1, // close popup button
      avatar = 1; // display user avatar
   
      var a=document.getElementsByTagName('A');
      for(i=0;i<a.length;i++)if(/\/u\d+/.test(a[i].href))a[i].className=a[i].className+' profilePopup';
      $('.profilePopup:has(img)').removeClass('profilePopup');
     
      var userWall='',userStats='',userAttachments='',userFriends='',userContact='',userRpg='',userClose='',guestView=true;
      if(wall==1)userWall='<span class="propop_tab" id="propop_vm">Sein</span>';if(stats==1)userStats='<span class="propop_tab" id="propop_stats">Statistika</span>';if(attachments==1)userAttachments='<span class="propop_tab" id="propop_attach">Manused</span>';if(friends==1)userFriends='<span class="propop_tab" id="propop_friends">Sõbrad</span>';if(contact==1)userContact='<span class="propop_tab" id="propop_contact">Kontakt</span>';if(rpg==1)userRpg='<span class="propop_tab" id="propop_rpg">Karakter</span>';if(close==1)userClose='<span class="propop_tab" id="close_popup" style="float:right;margin-top:-4px;">Sulge</span>';
   
      $('.profilePopup').click(function(){
        var UID=$(this).attr('href'),UNM=$(this).text(),SEL='#cp-main .panel, .forumline:has(#profile-advanced-details), .clear + #profile-advanced-details',LOAD='<div class="profileLoading" style="text-align:center;font-weight:bold;font-size:18px;">Laen...</div>';
        $('body').append('<div id="profilefilter" style="position:fixed;top:0px;left:0px;right:0px;bottom:0px;background:url(http://i39.servimg.com/u/f39/18/21/41/30/overla10.png);cursor:pointer;z-index:10;"></div><div id="profcont-container" style="background:#EEE;border:1px solid #CCC;top:20%;left:15%;right:15%;padding:4px;position:fixed;font-size:12px;border-radius:5px;z-index:50;"><div class="profile_popup_nav">'+userWall+'<span class="propop_tab" id="propop_profile">Profiil</span>'+userStats+userAttachments+userFriends+userContact+userRpg+userClose+'</div><a href="'+UID+'"><div id="userAVA"></div></a><div id="userprofile" style="height:400px;overflow-y:auto;">'+LOAD+'</div><span id="profileLinks"><a href="'+UID+'">Vaata profiili</a><span id="interactionLinks"> • <a href="/privmsg?mode=post&u='+UID.replace(/.*?\/u/,'')+'">Saada sõnum</a><span id="vmLink"> • <a href="/privmsg?mode=post_profile&u='+UID.replace(/.*?\/u/,'')+'">Kirjuta seinale</a></span><span style="float:right;"><a href="/profile?friend='+UNM.replace(/\s+/g,'+')+'&mode=editprofile&page_profil=friendsfoes">Lisa sõbraks</a> • <a href="/profile?foe='+UNM.replace(/\s+/g,'+')+'&mode=editprofile&page_profil=friendsfoes">Lisa vaenlaseks</a></span></span></div>');

        $('#userprofile').load(UID+SEL,function(){if($('#profcont-container #username').length&&_userdata.user_id==-1){$(this).html('<div class="profileLoading" style="text-align:center;font-weight:bold;font-size:18px;">Vabandame, külalised ei näe profiile!(</div>');guestView=false}});
        $('#propop_profile').addClass('activeTab');
        if (avatar == 1) $('#userAVA').load(UID+' #profile-advanced-right .module:first div img:first, .forumline td.row1.gensmall:first > img:first, .frm-set.profile-view.left dd img:first, dl.left-box.details:first dd img:first, .row1 b .gen:first img:first, .real_avatar img:first');
        loadPro('#propop_profile','');loadPro('#propop_vm','wall');loadPro('#propop_stats','stats');loadPro('#propop_friends','friends');loadPro('#propop_contact','contact');loadPro('#propop_rpg','rpg');loadPro('#propop_attach','attachments');
     
        if(wall==0)$('#vmLink').remove();
        if(!document.getElementById('logout'))$('#interactionLinks').remove();
        $('#profilefilter,#close_popup').click(function(){$('#profilefilter, #profcont-container').remove()});
        function loadPro(element, location){$(element).click(function(){if($(this).hasClass('activeTab')||guestView==false)return;$('#propop_profile,#propop_vm,#propop_stats,#propop_friends,#propop_contact,#propop_rpg,#propop_attach,#propop_close').removeClass('activeTab');$(this).addClass('activeTab');$('#userprofile').html(LOAD).load(UID+location+SEL)})}
        return false;
      });
    });
Talirand
Talirand

[FOORUM] Profile popup Vetera11
Liitus : 19/08/2014
Postitusi : 4846

PostitamineTalirand 08.02.16 2:43

flammable kirjutas:Lõpp tulemus:
[FOORUM] Profile popup Captur17

Alustuseks:

♦️ Loome javascripti
Administration Panel > Modules > JavaScript Codes Management
Pealkiri: Profile popup
Koht: All pages
Javascript:
Kood:
$(function () {
  if (/\/u\d+/.test(location.pathname)) return;
 
  var wall = 1, // visitor messages tab
  stats = 1, // statistics tab
  attachments = 0, // attachments tab
  friends = 1, // friends tab
  contact = 1, // contact tab
  rpg = 0, // RPG tab
  close = 1, // close popup button
  avatar = 1; // display user avatar
 
  var a=document.getElementsByTagName('A');
  for(i=0;i<a.length;i++)if(/\/u\d+/.test(a[i].href))a[i].className=a[i].className+' profilePopup';
  $('.profilePopup:has(img)').removeClass('profilePopup');
  
  var userWall='',userStats='',userAttachments='',userFriends='',userContact='',userRpg='',userClose='',guestView=true;
  if(wall==1)userWall='<span class="propop_tab" id="propop_vm">Visitor messages</span>';if(stats==1)userStats='<span class="propop_tab" id="propop_stats">Statistics</span>';if(attachments==1)userAttachments='<span class="propop_tab" id="propop_attach">Attachments</span>';if(friends==1)userFriends='<span class="propop_tab" id="propop_friends">Friends</span>';if(contact==1)userContact='<span class="propop_tab" id="propop_contact">Contact</span>';if(rpg==1)userRpg='<span class="propop_tab" id="propop_rpg">Character sheet</span>';if(close==1)userClose='<span class="propop_tab" id="close_popup" style="float:right;margin-top:-4px;">Close</span>';
 
  $('.profilePopup').click(function(){
    var UID=$(this).attr('href'),UNM=$(this).text(),SEL='#cp-main .panel, .forumline:has(#profile-advanced-details), .clear + #profile-advanced-details',LOAD='<div class="profileLoading" style="text-align:center;font-weight:bold;font-size:18px;">Loading...</div>';
    $('body').append('<div id="profilefilter" style="position:fixed;top:0px;left:0px;right:0px;bottom:0px;background:url(http://i39.servimg.com/u/f39/18/21/41/30/overla10.png);cursor:pointer;z-index:10;"></div><div id="profcont-container" style="background:#EEE;border:1px solid #CCC;top:20%;left:15%;right:15%;padding:4px;position:fixed;font-size:12px;border-radius:5px;z-index:50;"><div class="profile_popup_nav">'+userWall+'<span class="propop_tab" id="propop_profile">Profile</span>'+userStats+userAttachments+userFriends+userContact+userRpg+userClose+'</div><a href="'+UID+'"><div id="userAVA"></div></a><div id="userprofile" style="height:400px;overflow-y:auto;">'+LOAD+'</div><span id="profileLinks"><a href="'+UID+'">View Profile</a><span id="interactionLinks"> • <a href="/privmsg?mode=post&u='+UID.replace(/.*?\/u/,'')+'">Send PM</a><span id="vmLink"> • <a href="/privmsg?mode=post_profile&u='+UID.replace(/.*?\/u/,'')+'">Send VM</a></span><span style="float:right;"><a href="/profile?friend='+UNM.replace(/\s+/g,'+')+'&mode=editprofile&page_profil=friendsfoes">Add Friend</a> • <a href="/profile?foe='+UNM.replace(/\s+/g,'+')+'&mode=editprofile&page_profil=friendsfoes">Add Foe</a></span></span></div>');

    $('#userprofile').load(UID+SEL,function(){if($('#profcont-container #username').length&&_userdata.user_id==-1){$(this).html('<div class="profileLoading" style="text-align:center;font-weight:bold;font-size:18px;">Sorry, guests cannot view the profiles! :(</div>');guestView=false}});
    $('#propop_profile').addClass('activeTab');
    if (avatar == 1) $('#userAVA').load(UID+' #profile-advanced-right .module:first div img:first, .forumline td.row1.gensmall:first > img:first, .frm-set.profile-view.left dd img:first, dl.left-box.details:first dd img:first, .row1 b .gen:first img:first, .real_avatar img:first');
    loadPro('#propop_profile','');loadPro('#propop_vm','wall');loadPro('#propop_stats','stats');loadPro('#propop_friends','friends');loadPro('#propop_contact','contact');loadPro('#propop_rpg','rpg');loadPro('#propop_attach','attachments');
  
    if(wall==0)$('#vmLink').remove();
    if(!document.getElementById('logout'))$('#interactionLinks').remove();
    $('#profilefilter,#close_popup').click(function(){$('#profilefilter, #profcont-container').remove()});
    function loadPro(element, location){$(element).click(function(){if($(this).hasClass('activeTab')||guestView==false)return;$('#propop_profile,#propop_vm,#propop_stats,#propop_friends,#propop_contact,#propop_rpg,#propop_attach,#propop_close').removeClass('activeTab');$(this).addClass('activeTab');$('#userprofile').html(LOAD).load(UID+location+SEL)})}
    return false;
  });
});


♦️ ♦️  Nüüd Loome CSS STYLESHEET
Kood:
/* Profile popup */
#profcont-container {
    background:#EEE !important;
    border:1px solid #CCC !important;
}

#userAVA img{
    position:absolute;
    top:43px;
    right:30px;
    height:50px;
    width:50px;
}

.profile_popup_nav {
    background:#E0E0E0;
    margin:-4px -4px 10px -4px;
    padding:3px;
    padding-top:10px !important;
    height:auto;
    border-bottom:1px solid #CCC;
    -webkit-border-radius:5px 5px 0px 0px;
    -moz-border-radius:5px 5px 0px 0px;
    border-radius:5px 5px 0px 0px;
}

.propop_tab {
    color:#888;
    text-shadow:1px 1px 0 #F5F5F5;
    cursor:pointer;
    -webkit-border-radius:4px 4px 0px 0px;
      -moz-border-radius:4px 4px 0px 0px;
            border-radius:4px 4px 0px 0px;
    border:1px solid #CCC;
    border-bottom:none;
    -webkit-box-shadow:0px 10px 6px rgba(255,255,255, 0.5) inset;
      -moz-box-shadow:0px 10px 6px rgba(255,255,255, 0.5) inset;
            box-shadow:0px 10px 6px rgba(255,255,255, 0.5) inset;
    background:#DDD;
    margin:0 2px;
    padding:3px;
}

.propop_tab:hover {
    position:relative;
    top:1px;
    color:#666;
    text-shadow:none;
    background-color:#EEE;
}

.propop_tab.activeTab {
    position:relative;
    top:1px;
    color:#666;
    text-shadow:none !important;
    background-color:#EEE !important;
}

#profileLinks {
    background:#E0E0E0;
    display:block;
    padding:3px;
    margin:10px -4px -4px -4px;
    border-top:1px solid #CCC;
    -webkit-border-radius:0px 0px 5px 5px;
    -moz-border-radius:0px 0px 5px 5px;
    border-radius:0px 0px 5px 5px;
}

Kust kohast seda CSS STYLESHEET luua saab? :)
flammable
flammable

Liitus : 17/08/2014
Postitusi : 1600

Postitamineflammable 08.02.16 15:24

Enrique Iglesias kirjutas:Kust kohast seda CSS STYLESHEET luua saab? :)

Mine administratsioonpaneeli | Display | Colors | CSS stiilifail
Rare Skillzz
Rare Skillzz

Liitus : 01/04/2016
Postitusi : 457

PostitamineRare Skillzz 29.08.16 23:27

Toimis, aga need ikoonid ei tulnud.

Vaata eelmist teemat Vaata järgmist teemat Tagasi üles

Soovid vestluses osaleda?

Selleks logi sisse või tee endale kasutaja.

Liitu foorumiga

Tee endale kasutaja ning osale aruteludes.


Tee uus kasutaja

Logi sisse

Omad foorumis juba kasutajat? Logi sisse.


Logi sisse

 
Permissions in this forum:
Sa ei saa vastata siinsetele teemadele