Jump to content


Photo
- - - - -

Hover over Boxes

boxes hover

  • Please log in to reply
39 replies to this topic

#21 Danny

Danny

    Is Awesome!

  • Moderators
  • 13021 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 15 September 2013 - 09:08 PM

Is the code still active on your site now ?

#22 Danny

Danny

    Is Awesome!

  • Moderators
  • 13021 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 15 September 2013 - 09:11 PM

Remove that code I gave you and try this:

 

Please Login or Register to see this Hidden Content



#23 lroberts00

lroberts00

    Advanced Member

  • Members

  • 60 posts
  • Framework Version:2.4.1
  • Country: Country Flag

Posted 16 September 2013 - 06:02 PM

No, still disappears.  Thanks for your help.  I guess, if it can just be working on other browsers, we could do something different for firefox.



#24 Jake

Jake

    Advocate

  • Premium
  • 565 posts
  • LocationNC, USA
  • Country: Country Flag

Posted 17 September 2013 - 04:55 PM

Hi @

Please Login or Register to see this Hidden Content

- Not to beat a dead horse but I was able to get the kind of hover you're looking for working in FF on the carousel at

Please Login or Register to see this Hidden Content

with the following applied to the img on hover:

 

{filter: url("data:image/svg+xml;utf8,<svg xmlns=\'

Please Login or Register to see this Hidden Content

\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
  filter: gray; /* IE6-9 */
  -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
}

 

May be worth one last try...



#25 lroberts00

lroberts00

    Advanced Member

  • Members

  • 60 posts
  • Framework Version:2.4.1
  • Country: Country Flag

Posted 18 September 2013 - 11:37 PM

@

Please Login or Register to see this Hidden Content

thank so much for the reply, and I don't want to give up on this, because my client really really wants it.  But, what am I doing wrong?  I've applied your code, and still the images disappear in Firefox?

 

www.mandfiock.com

 

attached picture to see

Attached Files



#26 Jake

Jake

    Advocate

  • Premium
  • 565 posts
  • LocationNC, USA
  • Country: Country Flag

Posted 19 September 2013 - 07:20 PM

Hi @

Please Login or Register to see this Hidden Content

- I'm up for the challenge if you are and am still hopeful there's a solution somewhere. I'd like to see the site live but am having problems connecting, can you confirm the url for me?



#27 lroberts00

lroberts00

    Advanced Member

  • Members

  • 60 posts
  • Framework Version:2.4.1
  • Country: Country Flag

Posted 19 September 2013 - 10:08 PM

@

Please Login or Register to see this Hidden Content

, well, thank you so much! 

 

I missed a "y" in the url.  It is:   www.mandyfiock.com

 

Thanks a million for your help!



#28 Jake

Jake

    Advocate

  • Premium
  • 565 posts
  • LocationNC, USA
  • Country: Country Flag

Posted 19 September 2013 - 10:42 PM

No worries @

Please Login or Register to see this Hidden Content

- let me do some poking around and I'll report back with questions or (hopefully) answers. One thing I did find straight away, do you happen to be hosting on GoDaddy? -

Please Login or Register to see this Hidden Content

 

Also - have you already tried dropping the code in the style.css itself as opposed to the custom code section in the visual editor?



#29 lroberts00

lroberts00

    Advanced Member

  • Members

  • 60 posts
  • Framework Version:2.4.1
  • Country: Country Flag

Posted 20 September 2013 - 01:43 AM

No, I have hosting with hosting24.com.

 

I have not tried the style.css but I will. I'll let you know.


  • Jake likes this

#30 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 21 September 2013 - 09:55 PM

Keep us posted about your progress.



#31 nicoleisthenewblack

nicoleisthenewblack

    Member

  • Members
  • 16 posts
  • Country: Country Flag

Posted 08 January 2014 - 10:00 AM

Hi all, Im having a similar problem but I actually want to change the image to a different image upon hover.

Can I do that to a box..with css? Perhaps I am trying to change the wrong thing.

For instance on my site

nicoleisthenewblack.com

 

I have three boxes in the header and upon hover i want each picture to change to an image with text and a colored background that is semi transparent.

 

i have the box ID

and i tried this and other things but nothing is working, any ideas

 

 

#fbox_4950:hover {
background-image: url('*url of replacement image*')
}

 

i've tried img src and content as well

 

any hints

 

HELP!! :)



#32 Danny

Danny

    Is Awesome!

  • Moderators
  • 13021 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 08 January 2014 - 02:18 PM

@

Please Login or Register to see this Hidden Content

- This topic is related to the iBoxes section in DMS. You're using PageLines Framework and a very old version at that. I recommend you first update to the latest version of PageLines Framework 2.4.4 (your version is 2.1.3) or upgrade to DMS, as iBoxes is a DMS only section.

 

Once you have updated your PageLines Framework, please create a new topic in the PageLines Framework forum, then we will be able to assist you. If you have upgraded to DMS, then reply here letting us and we can try and assist you with the changing of images upon hover. If you use the iBoxes section that is.



#33 lroberts00

lroberts00

    Advanced Member

  • Members

  • 60 posts
  • Framework Version:2.4.1
  • Country: Country Flag

Posted 08 January 2014 - 03:05 PM

I am not using DMS either, Im using Pagelines Framework.  Is that why I've still not been able to make it work in firefox?

 

Please Login or Register to see this Hidden Content



#34 Martin Davies

Martin Davies

    Advocate

  • Moderators
  • 2469 posts
  • LocationManchester, England
  • Framework Version:latest
  • Country: Country Flag

Posted 08 January 2014 - 03:54 PM

@

Please Login or Register to see this Hidden Content

Please could you confirm for me, are you just trying to replicate the hover & fade to grey effect on your site in Firefox? 



#35 lroberts00

lroberts00

    Advanced Member

  • Members

  • 60 posts
  • Framework Version:2.4.1
  • Country: Country Flag

Posted 08 January 2014 - 04:07 PM

Correct.  I'm just trying to make the picture gray scale when hoovering.  It works with Chrome.  Just now with firefox.



#36 Martin Davies

Martin Davies

    Advocate

  • Moderators
  • 2469 posts
  • LocationManchester, England
  • Framework Version:latest
  • Country: Country Flag

Posted 08 January 2014 - 04:08 PM

A little bit of googling turns out that the Grayscale filter property does not work with Firefox as it does with other browsers. Different browsers handle css differently and Firefox is no exception. The issue you are seeing is with the CSS and the browser and not a limitation of the Framework or Wordpress. 

 

There is an article here with alternative method detailed that it might be worth trying 

Please Login or Register to see this Hidden Content

 

You will likely need to target the Firefox browser and apply alternative CSS that only has an effect on the site in Firefox. 

 

Information on doing this within the Framework can be found here 

Please Login or Register to see this Hidden Content



#37 lroberts00

lroberts00

    Advanced Member

  • Members

  • 60 posts
  • Framework Version:2.4.1
  • Country: Country Flag

Posted 08 January 2014 - 04:11 PM

Thanks Martin, will try!



#38 Martin Davies

Martin Davies

    Advocate

  • Moderators
  • 2469 posts
  • LocationManchester, England
  • Framework Version:latest
  • Country: Country Flag

Posted 08 January 2014 - 04:14 PM

No problem @lroberts00 

 

Please let us know how you get on - were a little limited what we can do to help with this but can probably take a look if you have issues implementing anything within the Framework 



#39 nicoleisthenewblack

nicoleisthenewblack

    Member

  • Members
  • 16 posts
  • Country: Country Flag

Posted 08 January 2014 - 05:55 PM

i dont plan to update the DMS. i just dont have the time to learn something new AND i really can financially invest in an upgrade right now. so i'll update my pagelines framework and open up a post in the appropriate section.

 

thanks



#40 Martin Davies

Martin Davies

    Advocate

  • Moderators
  • 2469 posts
  • LocationManchester, England
  • Framework Version:latest
  • Country: Country Flag

Posted 08 January 2014 - 11:45 PM

@nicoleisthenewblack 

 

ok thanks







Also tagged with one or more of these keywords: boxes, hover