News:

Want to get involved in developing SMF, then why not lend a hand on our github!

Main Menu

Reflection Avatar

Started by M-DVD, September 15, 2008, 07:23:57 PM

Previous topic - Next topic

Neo2099

#60
thank you! nice mod!

Only a question...
Why in Firefox, Opera, safari  animated gif don't work?
In IE with animated gif there are no problem.

Thank you, bye  :)

qubbah

#61
ho do i align center the avatar? the avatar align center in IE but left align in FF

M-DVD

Quote from: Neo2099 on November 29, 2008, 02:42:55 AM
thank you! nice mod!

Only a question...
Why in Firefox, Opera, safari  animated gif don't work?
In IE with animated gif there are no problem.

Thank you, bye  :)

Thank you.

So far i know, is "problem" of the browsers, not the script.

Quote from: qubbah on November 29, 2008, 09:47:10 AM
ho do i align center the avatar? the avatar align center in IE but left align in FF

Already did this?

http://www.simplemachines.org/community/index.php?topic=262194.msg1792608#msg1792608

and Refresh your site with: Ctrl+F5

and tell me if it works.


spiritualyouth

Quote from: M-DVD on October 16, 2008, 10:10:06 PM
Quote from: haley on October 16, 2008, 05:47:55 PM
i've tried to install this, but it installs straight to the default theme, and i'm using a custom one. what do i need to edit in my theme to get this to work?

Hi
   
Is very easy

You must edit the "index.template.php"

Find

</head>

and put before


<script language="JavaScript" type="text/javascript" src="', $settings['default_theme_url'], '/reflection.js?fin11"></script>


or in SMf beta 2


<script language="JavaScript" type="text/javascript" src="', $settings['default_theme_url'], '/scripts/reflection.js?b4"></script>





Never worked for me, I'm using MysticOpal and I don't have any other java problems or java based mods installed. Any ideas?

M-DVD

But possibly your host has adds, js, popups.

URL of your forum?

spiritualyouth

Hey, I've closed the forum now, but no there was no popups or js from the host, thanks anyway

Lord Anubis

Nope this mod still doesn't center the avatars for Chrome or FF3, it instead left aligns them

M-DVD

Quote from: Lord Anubis on December 13, 2008, 11:54:40 PM
Nope this mod still doesn't center the avatars for Chrome or FF3, it instead left aligns them

Hi.

Edit your style.css

Search:

.avatar { overflow: hidden; }

Replace:

.avatar { overflow: hidden; margin: auto }

Important: Save and Refresh your Browser with Ctrl+F5 (clear your browser cache) before you will be able to see the changes.

O:)

Lord Anubis

#68
Worked like a charm, I did all the edits except in the style.css

Edit: I noticed that the new package doesn't include the added margin:auto in the style.css

Nao 尚

Oh, funny, just found out about this other mod of yours, M-DVD... ;)

I actually first saw reflection.js being used on another board (passion-xbmc.org), and thought they'd installed it manually. Maybe they used your mod, I'm not sure...
I installed the thing manually and it didn't work under Opera. I modified reflection.js to relocate the created canvas's paddingTop to (divHeight-reflectionHeight)+'px' and then it worked. Just so you know... There may be themes where reflections appear right beneath the avatar (behind it), instead of below it. I think it's because reflection.js expects the image's div container to not have specific sizes.

My goal was to make my user info appear on top of the reflection, I made it work but it wasn't too readable, and changing the reflection's alpha to something lighter wouldn't look too good, so I gave up for now. I may work on it again in the future though. If I have some spare time :)
I will not make any deals with you. I've resigned. I will not be pushed, filed, stamped, indexed, briefed, debriefed or numbered.

Aeva Media rocks your life.

M-DVD

Oh, thank you.

If you find flaws or improvements, you can contact the author of reflect.js, sure you appreciate.

Also, I will be careful of what you say it can occur in some themes.

I have also been working a bit with this code, especially to change the DIV, and change that 'Image with Reflection', for an not element block, but I have not had time.

Lord Anubis

#71
This is a personal theme problem lol, but if you can help.....on my PMs it is centering the avatars

Screenshot: HERE

It covers all the buttons for the PM section

any idears on how to fix that easily?

M-DVD

Quote from: Lord Anubis on December 17, 2008, 12:10:00 AM
This is a personal theme problem lol, but if you can help.....on my PMs it is centering the avatars

Screenshot: HERE

It covers all the buttons for the PM section

any idears on how to fix that easily?

Sorry, i haven't much idea.

You can edit the file PersonalMessage.template.php, find the variable of the avatar and put some <br /> after or before, depending. Thing is, try and test. It is everything that I can think of.

And that template of PM is different, I have never seen anything like this.  :)

Apllicmz




M-DVD


Rehash D Internet

All thought this installed fine it isn't actually having any effect. Can you help, please?

M-DVD

Quote from: Rehash D Internet on February 05, 2009, 05:27:32 PM
All thought this installed fine it isn't actually having any effect. Can you help, please?

Sure.

Have you edited your theme? Does work in default theme?

URL?

crazyASD

Well all work fine, exept userprofile avatar at top of page (index.template.php):
if (!empty($context['user']['avatar']))
echo '
<td class="windowbg" valign="middle">', $context['user']['avatar']['image'], '</td>';

Here effect isn`t appear :(

M-DVD

#78
Quote from: crazyASD on March 20, 2009, 07:46:06 PM
Well all work fine, exept userprofile avatar at top of page (index.template.php):
if (!empty($context['user']['avatar']))
echo '
<td class="windowbg" valign="middle">', $context['user']['avatar']['image'], '</td>';

Here effect isn`t appear :(

Ok, because there is no reflection here XD

1 .- Because all themes not show the avatar here.
2 .- Because it wasn't looked good in default theme.

If you want to add this, then do this change:

Edit he Subs.php

Search:

if (!empty($context['user']['avatar']))
$context['user']['avatar']['image'] = '<img src="' . $context['user']['avatar']['href'] . '"' . (isset($context['user']['avatar']['width']) ? ' width="' . $context['user']['avatar']['width'] . '"' : '') . (isset($context['user']['avatar']['height']) ? ' height="' . $context['user']['avatar']['height'] . '"' : '') . ' alt="" class="avatar" border="0" />';


Replace:

if (!empty($context['user']['avatar']))
$context['user']['avatar']['image'] = '<img src="' . $context['user']['avatar']['href'] . '"' . (isset($context['user']['avatar']['width']) ? ' width="' . $context['user']['avatar']['width'] . '"' : '') . (isset($context['user']['avatar']['height']) ? ' height="' . $context['user']['avatar']['height'] . '"' : '') . ' alt="" class="avatar reflect" border="0" />';


Note: In the next version, i will add this feature as: enable/disable. The current reflect also will be enable/disable.

kromonos

Works nice with Linux Browsers: Epiphany 2.26.0 2.27.2-WebKit and Midori 0.1.5.
Thank you for this nice mod :)

Advertisement: