Latest topics
» Forumactif Edge - Releases
by Ange Tuteur Tue 03 Sep 2019, 11:49
» GIFActif - Giphy Button for the Editor
by Ange Tuteur Wed 08 May 2019, 17:21
» Forum Closure
by Ange Tuteur Mon 01 Jan 2018, 01:28
» Chit Chat Thread
by Valoish Sun 31 Dec 2017, 19:15
» Font/Text background color.
by Valoish Sun 31 Dec 2017, 19:11
» Forumactif Messenger - Instant Message Application for Forumotion
by Wolfuryo Sun 31 Dec 2017, 18:24
» [GAME] Count to One Million!
by brandon_g Fri 29 Dec 2017, 18:58
» Post Cards
by manikbiradar Wed 20 Dec 2017, 07:50
» [GAME] Countdown from 200,000
by Valoish Wed 13 Dec 2017, 23:22
» GeekPolice Tech Support Forums - GeekPolice.net
by Dr Jay Mon 11 Dec 2017, 19:12
» Asking about some plugin for Forumotion
by Dr Jay Mon 11 Dec 2017, 19:10
» [GAME] What are you thinking right now?
by Van-Helsing Sat 09 Dec 2017, 14:51
» Widget : Similar topics
by ranbac Wed 06 Dec 2017, 18:11
» Change the Background of the Forum and put an image and how to make prefixs?
by Clement Wed 06 Dec 2017, 15:19
» Hello from Western Australia
by SarkZKalie Wed 06 Dec 2017, 05:34
by Ange Tuteur Tue 03 Sep 2019, 11:49
» GIFActif - Giphy Button for the Editor
by Ange Tuteur Wed 08 May 2019, 17:21
» Forum Closure
by Ange Tuteur Mon 01 Jan 2018, 01:28
» Chit Chat Thread
by Valoish Sun 31 Dec 2017, 19:15
» Font/Text background color.
by Valoish Sun 31 Dec 2017, 19:11
» Forumactif Messenger - Instant Message Application for Forumotion
by Wolfuryo Sun 31 Dec 2017, 18:24
» [GAME] Count to One Million!
by brandon_g Fri 29 Dec 2017, 18:58
» Post Cards
by manikbiradar Wed 20 Dec 2017, 07:50
» [GAME] Countdown from 200,000
by Valoish Wed 13 Dec 2017, 23:22
» GeekPolice Tech Support Forums - GeekPolice.net
by Dr Jay Mon 11 Dec 2017, 19:12
» Asking about some plugin for Forumotion
by Dr Jay Mon 11 Dec 2017, 19:10
» [GAME] What are you thinking right now?
by Van-Helsing Sat 09 Dec 2017, 14:51
» Widget : Similar topics
by ranbac Wed 06 Dec 2017, 18:11
» Change the Background of the Forum and put an image and how to make prefixs?
by Clement Wed 06 Dec 2017, 15:19
» Hello from Western Australia
by SarkZKalie Wed 06 Dec 2017, 05:34
Recent Tutorials
Top posting users this month
Top Achievers
Who is online?
In total there are 8 users online :: 0 Registered, 0 Hidden and 8 Guests :: 2 Bots
None
Most users ever online was 515 on Tue 14 Sep 2021, 15:24
None
Most users ever online was 515 on Tue 14 Sep 2021, 15:24
Navbar Profile Tooltip Options
Page 1 of 1 • Share
- Ace 1
Valued Member - Gender :
Age : 25
Posts : 2153
Points : 5527
Reputation : 95
Location : USA
Language : English ?
Browser :
Forum Version : 
-
Ace 1 Tue 15 Nov 2016, 13:08
This is just some small thing I made for the Profile link in the navbar. It gives a little tooltip with an extra option to view the profile.
Administration Panel > Modules > HTML & JS > JS codes management > Create a new javascript
Title: Navbar Profile Tooltip
Placement: In all the pages
Code:
Here are some modifications:
lang - This is just the text that appears inside the tooltip.
default_path - This determines what link is followed when the user clicks "Profile" within the navbar.
Hope you guys like it; I have some more tutos on the way
Administration Panel > Modules > HTML & JS > JS codes management > Create a new javascript
Title: Navbar Profile Tooltip
Placement: In all the pages
Code:
- Code:
$(function() {
var lang = {
profile_options: 'Profile Options',
view_profile: 'View Profile',
edit_profile: 'Edit Profile'
},
// -1 no default
// 0 view profile default
// 1 edit profile default
default_path = 1,
id = '/u' + _userdata.user_id,
link = $('.navbar .mainmenu').filter(function() {
return /\/profile\?mode=editprofile/.test(this.href)
}),
fm_profile_options = [];
default_path == 1 ? '' : default_path == 0 ? link.attr('href', id) : link.removeAttr('href');
link.tooltipster({
animation: 'fade',
interactive: true,
contentAsHTML: true,
minWidth: 150,
maxWidth: 200,
delay: 100,
theme: 'tooltipster-default',
arrowColor: "#EEE",
autoClose: true,
content: '<h2>' + lang.profile_options + '</h2>',
functionBefore: function(origin, continueTooltip) {
continueTooltip();
if (origin.data('ajax') !== 'cached') {
if (fm_profile_options[0] != undefined) {
origin.tooltipster('content', fm_profile_options[0]).data('ajax', 'cached');
} else {
var URL = $(this).attr('href'),
container = $('<div>' +
'<div class = "fm_profile_options" > ' +
'<h2 class="fm_profile_options_header">' + lang.profile_options + '</h2>' +
(/\/u\d+/.test(URL) ? '' : '<p class="fm_view_profile"><a href="' + id + '">' + lang.view_profile + '</a></p>') +
(/\/profile\?/.test(URL) ? '' : '<p class="fm_edit_profile"><a href="/profile?mode=editprofile">' + lang.edit_profile + '</a></p>') +
'</div>' +
'</div>');
fm_profile_options[0] = container.html();
origin.tooltipster('content', fm_profile_options[0]).data('ajax', 'cached');
}
}
}
});
$('head').append(
'<style type="text/css">' +
'.mainmenu.tooltipstered { cursor: pointer; }' +
'.fm_profile_options { font-family: Arial; font-size: 12px; margin-bottom: 5px; text-align: center; }' +
'.fm_profile_options_header { font-size: 1.5em; margin: .66em .25em; }' +
'.fm_profile_options p { margin: 3px; }' +
'</style>'
);
});
Here are some modifications:
lang - This is just the text that appears inside the tooltip.
- Code:
var lang = {
profile_options: 'Profile Options',
view_profile: 'View Profile',
edit_profile: 'Edit Profile'
},
default_path - This determines what link is followed when the user clicks "Profile" within the navbar.
- Code:
// -1 no default
// 0 view profile default
// 1 edit profile default
default_path = 1,
Hope you guys like it; I have some more tutos on the way
Credits to Ange's group preview tutorial for giving me something to work with.
Similar topics
Create an account or log in to leave a reply
You need to be a member in order to leave a reply.
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum