X
Tap here to go to the mobile version of the site.

ஆதரவு மன்றம்

Problem with background image

  • 8 replies
  • 5 இந்த பிரச்னைகள் உள்ளது
  • Last reply by Star Light
பதிவிடப்பட்டது

Normally, this code works well:

<style>

      #avata {
               background-image: url(http://s.gravatar.com/avatar/a1405f3b6d817e8073f7cdb433140a3e?s=128);
               background-size: 100%;
               background-repeat: no-repeat;
               display: block;
               border: 6px solid gray;
               height: 128px;
               width: 128px;
               transition: border-color 0.4s ease;
               -webkit-transition: border-color 0.4s ease
     }
     #avata:hover {border-color: orange}

</style>

But today, it suddenly become lost image. When I use F12, I have found out once problem. URL "http://s.gravatar.com/avatar/a1405f3b6d817e8073f7cdb433140a3e?s=128" has been changed to this "https://mozillawebmakerproxy.net/be27158d4e89335cc12be171d679139656280fcd?url=http://s.gravatar.com/avatar/a1405f3b6d817e8073f7cdb433140a3e?s=128" And image become disappear! I don't how to fix, could anyone give me a little help, plz?

Normally, this code works well: <style> #avata { background-image: url(http://s.gravatar.com/avatar/a1405f3b6d817e8073f7cdb433140a3e?s=128); background-size: 100%; background-repeat: no-repeat; display: block; border: 6px solid gray; height: 128px; width: 128px; transition: border-color 0.4s ease; -webkit-transition: border-color 0.4s ease } #avata:hover {border-color: orange} </style> But today, it suddenly become lost image. When I use F12, I have found out once problem. URL "http://s.gravatar.com/avatar/a1405f3b6d817e8073f7cdb433140a3e?s=128" has been changed to this "https://mozillawebmakerproxy.net/be27158d4e89335cc12be171d679139656280fcd?url=http://s.gravatar.com/avatar/a1405f3b6d817e8073f7cdb433140a3e?s=128" And image become disappear! I don't how to fix, could anyone give me a little help, plz?

Star Light மூலமாக திருத்தப்பட்டது

தீர்வு தேர்ந்தெடுக்கப்பட்டது

I'm filing a bug about this issue.

Thanks

Read this answer in context 0

Additional System Details

பயன்பாடு

  • User Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/33.0.1750.154 Safari/537.36

கூடுதல் தகவல்

iamjayakumars 489 தீர்வுகள் 5951 பதில்கள்
பதிவிடப்பட்டது

Try with Image Extensions like .jpg .png

Thimble thinks, its not an image link.

Even if you use the same code and save in .HTML file and run it, it won't come up.

Try with Image Extensions like .jpg .png Thimble thinks, its not an image link. Even if you use the same code and save in .HTML file and run it, it won't come up.
பதிவிடப்பட்டது

கேள்வியின் உரிமையாளர்

I don't think so, therefore, it was working very well until yesterday.

I don't think so, therefore, it was working very well until yesterday.
iamjayakumars 489 தீர்வுகள் 5951 பதில்கள்
பதிவிடப்பட்டது

Hi Star,

The problem is Thimble create everything inside the Frame, so the image link embedded with Mozilla Thimble, when it executes, the image is without extension so it becomes like URL not Image URL.

Try this below code

<style type="text/css">
     #avata {
   background-image:url(https://farm8.staticflickr.com/7098/13543892295_1061a347c0_m.jpg); 
              background-size: 100%;
              background-repeat: no-repeat;
              display: block;
              border: 6px solid gray;
              height: 128px;
              width: 128px;
              transition: border-color 0.4s ease;
              -webkit-transition: border-color 0.4s ease
    }

#avata:hover {border-color: orange} </style>

Hi Star, The problem is Thimble create everything inside the Frame, so the image link embedded with Mozilla Thimble, when it executes, the image is without extension so it becomes like URL not Image URL. Try this below code <style type="text/css"> #avata { background-image:url(https://farm8.staticflickr.com/7098/13543892295_1061a347c0_m.jpg); background-size: 100%; background-repeat: no-repeat; display: block; border: 6px solid gray; height: 128px; width: 128px; transition: border-color 0.4s ease; -webkit-transition: border-color 0.4s ease } '''#avata:hover {border-color: orange}''' </style>

iamjayakumars மூலமாக திருத்தப்பட்டது

பதிவிடப்பட்டது

கேள்வியின் உரிமையாளர்

I mean that code was working well in Thimble, but now it isn't. That mean, somehow Thimble was acceptation my code. I don't know why it doesn't accept it anymore.

=

Oh, I think I have found the error. When I change port it working again. Change from "http://" to "https://". Don't know why :p

Anyway, sorry for bother you. And thank you so much for helping me without complain :) - Please close this question. Sorry again for my stupid :p

I mean that code was working well in Thimble, but now it isn't. That mean, somehow Thimble was acceptation my code. I don't know why it doesn't accept it anymore. === Oh, I think I have found the error. When I change port it working again. Change from "http://" to "https://". Don't know why :p Anyway, sorry for bother you. And thank you so much for helping me without complain :) - Please close this question. Sorry again for my stupid :p

Star Light மூலமாக திருத்தப்பட்டது

iamjayakumars 489 தீர்வுகள் 5951 பதில்கள்
பதிவிடப்பட்டது

Ha ha..

We are here to Support and help you.

Thanks :)

If this Question solved. Please Mark as Solution and close the thread

Ha ha.. We are here to Support and help you. Thanks :) If this Question solved. Please Mark as Solution and close the thread
iamjayakumars 489 தீர்வுகள் 5951 பதில்கள்
பதிவிடப்பட்டது

தீர்வு தேர்ந்தெடுக்கப்பட்டது

I'm filing a bug about this issue.

Thanks

I'm filing a bug about this issue. Thanks
iamjayakumars 489 தீர்வுகள் 5951 பதில்கள்
பதிவிடப்பட்டது

உதவிகரமான பதில்

Hi Star Light, The issue resolved. Try it now. Thanks

Hi Star Light, The issue resolved. Try it now. Thanks
பதிவிடப்பட்டது

கேள்வியின் உரிமையாளர்

Oh, it really back to normal. Thanks a lot, I know that you guys never let fans doubt.

Oh, it really back to normal. Thanks a lot, I know that you guys never let fans doubt.