1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Whats this nice collage-style banner?

Discussion in 'Web Design' started by creativepotion, Aug 11, 2012.

  1. creativepotion

    creativepotion Regular Member

    Joined:
    Jun 23, 2012
    Messages:
    305
    Likes Received:
    19
    I came across this site

    Code:
    [URL]http://www.vivint.com/[/URL]
    and I really love their collage-style banner in the middle of the page, especially the hover on the "+" sign.
    Whats that plugin? Is there anywhere I can purchase that?

    thanks in advance.
     
  2. creativepotion

    creativepotion Regular Member

    Joined:
    Jun 23, 2012
    Messages:
    305
    Likes Received:
    19
    bumping.. any idea?
     
  3. derzok

    derzok Newbie

    Joined:
    Aug 11, 2012
    Messages:
    15
    Likes Received:
    4
    Looks like some custom work to me. Probably backed by jquery or prototype, but it looks custom to me. If you view the javascript sourcecode for the page, it's heavily obfuscated (probably to protect their code from being stolen).

    I'm sure you could do something similar though - just get a jquery tool-tip popup plugin and use some absolute positioning to get your + signs where you want them.
     
  4. utuxia

    utuxia BANNED BANNED

    Joined:
    Feb 14, 2011
    Messages:
    673
    Likes Received:
    111
    Yes. custom coding.
     
  5. creativepotion

    creativepotion Regular Member

    Joined:
    Jun 23, 2012
    Messages:
    305
    Likes Received:
    19
    Any similar plugins / script on themefores / codecanyone etc.?

    Thanks
     
  6. Derrick H

    Derrick H Registered Member

    Joined:
    Jul 9, 2012
    Messages:
    77
    Likes Received:
    13
    Occupation:
    Sales Manager for SeoWebHosting.net
    Location:
    North Carolina
    Home Page:
    Definitely custom coding looking at their source code, I don't know of any plug in that can create this I am sure some template designers could whip something like us for you quickly...Or you can do what Derzok recommended above...?


     
  7. creativepotion

    creativepotion Regular Member

    Joined:
    Jun 23, 2012
    Messages:
    305
    Likes Received:
    19
    Unfortunately, I dont think I can do what derzok recommended. LOL
    Quite weak at coding.

    I guess if I really wanted something like that, I will probably need to hire/outsource to a developer
    It definitely looks nice tho. What you guys think.
     
  8. monchichi

    monchichi Power Member

    Joined:
    Jun 3, 2011
    Messages:
    591
    Likes Received:
    248
    Occupation:
    BOSS.
    Location:
    173.194.35.147
    You may ask creativezz or yachika here on BHW. I know both of them are able to code this with jquery.
     
    • Thanks Thanks x 1
  9. NojWang

    NojWang Newbie

    Joined:
    Dec 19, 2011
    Messages:
    42
    Likes Received:
    15
    Occupation:
    Entrepreneur
    Location:
    Canada
    I agree with the rest that this is probably not a plugin.
    It looks to me like they just use CSS to pull off this metro style effect.
    The basic ingredients which make up the design are linked below.

    From the HTML:
    <a id="collage-dot-1" class="collage-dot down" alt="Saving you money, saving the planet" href="/home-energy-management"></a>

    From the CSS:
    media.vivint.com/www[dot]vivint.com/en/images/front/front-collage.jpg
    media.vivint.com/www[dot]vivint.com/en/images/front/collage-tooltip-up .png
    media.vivint.com/www[dot]vivint.com/en/images/front/collage-tooltip-down .png
    media.vivint.com/www[dot]vivint.com/en/images/front/front-collage-dot .png

    If you need some help with image maps this is a solid tutorial.
    www[dot]position-relative.com/tutorials/tute1_css_bg_image.php


    Good luck with your project.
     
    • Thanks Thanks x 1
  10. socialdevinfo

    socialdevinfo Junior Member

    Joined:
    Nov 14, 2009
    Messages:
    102
    Likes Received:
    32
    I can do that using moo tools, let me know if you need any help...
     
  11. creativepotion

    creativepotion Regular Member

    Joined:
    Jun 23, 2012
    Messages:
    305
    Likes Received:
    19
    This sounds great. Not sure how hard it is to code something like that, but if its easy, it will be great if you can code it and share it with everyone here :)
    (of course, thats only if you dont mind and not too time consuming)
     
  12. socialdevinfo

    socialdevinfo Junior Member

    Joined:
    Nov 14, 2009
    Messages:
    102
    Likes Received:
    32
    yep I will do it, this weekend...... you guys ok!!!
     
    • Thanks Thanks x 2
  13. creativepotion

    creativepotion Regular Member

    Joined:
    Jun 23, 2012
    Messages:
    305
    Likes Received:
    19
    Wow this is great! Thanks in advance. Keep us updated!
     
  14. creativepotion

    creativepotion Regular Member

    Joined:
    Jun 23, 2012
    Messages:
    305
    Likes Received:
    19
    Any updates on this? Thanks
     
  15. Blackberry_11

    Blackberry_11 Regular Member

    Joined:
    Apr 17, 2011
    Messages:
    266
    Likes Received:
    19
    Actually i did not liked it all .This design should be much more attractive than this. I think you can do better than this.