The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

JavaScript/CSS adding picture For VM notification.

View previous topic View next topic Go down

Solved JavaScript/CSS adding picture For VM notification.

Post by viper8421 on February 6th 2013, 1:26 am

So I have it set up for VM messages, but i want to replace the pop-up with this picture.



JavaScript code
Code:
var uid='';
var uname='';

function ddginit() {
    var x=document.getElementById('unl');
    x.style.display='none';
    uid=x.childNodes[0].href.substring(x.childNodes[0].href.indexOf('&u=')+3);
    uname=x.childNodes[0].innerHTML;
    x.innerHTML='<span id="uid">'+uid+'</span><span id="uname">'+uname+'</span>';
    document.body.insertBefore(x,document.body.firstChild);
}


$(function() {
  var url = 'u' + uid + 'wall',
      count, old;
  if (location.pathname.indexOf(url) >= 0) {
    count = $('.message-footer:first a:first')[0];
    if (count) {
      count = /s=(\d+)/.exec(count.href)[1];
      my_setcookie('bilde-vm', count);
    }
    return;
  }
  $('<div id="bilde-vm"></div>').hide().load(url + ' .message-footer:first a:first', function() {
    count = this.firstChild;
    old = my_getcookie('bilde-vm') || 0;
    if (count) {
      count = /s=(\d+)/.exec(count.href)[1];
      if (count > old) {
        $(this).html('<a href="' + url + '">You have a new visitor message</a>').prependTo(document.body).fadeIn();
      }
    }
  });
});


CSS code
Code:
/*VM Notification*/
#bilde-vm {
  position: fixed;
  top: 10px;
  left: 10px;
  background: E9E9E9;
  border: 1px solid #FFF;
  padding: 5px;
  z-index: 999;
  outline: 1px solid #444;
}
#bilde-vm a {
  color: #444;
  text-decoration: none;
  text-shadow: 0 1px 0 #FFF;
}
#bilde-vm a:hover {
  text-shadow: 0 -1px 0 #FFF;
}

All this code works, i just want to replace the popup now with a picture.


Last edited by viper8421 on February 6th 2013, 4:27 am; edited 1 time in total

viper8421
New Member

Posts : 13
Reputation : 1
Language : English

http://justdubsrefuge.omgforum.net

Back to top Go down

Solved Re: JavaScript/CSS adding picture For VM notification.

Post by SLGray on February 6th 2013, 2:49 am

Try replacing this part of the JavaScript
Code:
$(this).html('<a href="' + url + '">[b][color=#339933]You have a new visitor message[/color][/b]</a>').prependTo(document.body).fadeIn();
Change
Code:
[b][color=#339933]You have a new visitor message[/color][/b]
to what you want.

You do know that you do not get a pm. In the picture you said inbox.


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36639
Reputation : 2441
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: JavaScript/CSS adding picture For VM notification.

Post by viper8421 on February 6th 2013, 4:06 am

@SLGray wrote:Try replacing this part of the JavaScript
Code:
$(this).html('<a href="' + url + '">[b][color=#339933]You have a new visitor message[/color][/b]</a>').prependTo(document.body).fadeIn();
Change
Code:
[b][color=#339933]You have a new visitor message[/color][/b]
to what you want.

You do know that you do not get a pm. In the picture you said inbox.

I tired that and it stays the way it was before. like this:


And yeah, it was just kinda refering to the VM "inbox"

EDIT: ahh I'm sorry, the other admin changed it so it was in the Announcements
the actual code is
Code:
<div id="LGvms" style="display:none">{USERLINK}</div>
<script type="text/javascript">
(function() {
    ('Visitor message notification pop up for Forumotion boards. Copyright by AvacWeb. All Rights Reserved. Use and  modification of this script is not allowed without this entire copyright notice in the original, copied, or modified script. No distribution without consent.');
  var holder = document.getElementById('LGvms');
  var cookie = my_getcookie('LGvms') || 2000;
  var url = holder.firstChild.href + '&page_profil=messages';
  if(url.indexOf('&u=-1') > 0) return;
  jQuery(holder).load(url + ' #cp-main h1', function() {
      var nums = holder.firstChild.innerHTML.match(/[0-9]+/g);
      var totalVMs = parseInt(nums[nums.length-1]);
      if(totalVMs > cookie) {
        holder.innerHTML = '<a href="' + url + '">You have ' + (totalVMs - cookie) + ' new visitor messages.</a>';
        holder.style.display = '';
      }
      my_setcookie('LGvms', totalVMs, 1);
  });
})();</script>


EDIT #2:
I got it working, here was the solution
Code:

      if(totalVMs > cookie) {
        holder.innerHTML = '<img src="http://i139.photobucket.com/albums/q292/Sporadic_Bullet/VmS_zps0c0e096e.gif" alt="Pulpit rock" width="304" height="228">';
        holder.style.display = '';
      }</script>

I just did what you said to do but on this one. Thank you for your help!

viper8421
New Member

Posts : 13
Reputation : 1
Language : English

http://justdubsrefuge.omgforum.net

Back to top Go down

Solved Re: JavaScript/CSS adding picture For VM notification.

Post by Sanket on February 6th 2013, 4:43 am

Glad you posted the solution.
Topic Solved & Locked

Sanket
ForumGuru

Male Posts : 48766
Reputation : 2819
Language : English
Location : Mumbai

http://webartzforum.com

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum