I have created a background which changes onmouseover of "test image". This works on a normal hosted account at http://zabb.co.uk/full_page_ebay_table_working.html but not when placed within an eBay auction http://cgi.ebay.co.uk/ws/eBayISAPI.dll?ViewItem&item=160653524585#ht_802wt_1398 (scroll down required).
Is there a way to fix this so that it works in eBay please? Thanks very much! Regards,
Paul
I'm not sure to what extent eBay allows javascript, but I would have thought that you could achieve something with a CSS hover pseudo.
You could do the following, which would cause a background-image change on hover.
<style type="text/css">
table#bigPic { background: url(http://images.worldgallery.co.uk/i/prints/rw/lg/6/0/Derek-Hare-Sunset-Over-the-Sea-60196.jpg);
table#bigPic:hover { background: url(http://josefsipek.net/docs/s390-linux/hercules-s390/ssh-dasd1.png); }
</style>
For security reasons, it is utterly impossible to use Javascript in an eBay page.
Related
Thank you for your kind reading my question. I have trouble in aligning layout of Recurly subscription form.
In the screenshot, the first 4 items are using .form-control which has inside it. These s are loaded by Recurly JS code after page is loaded.
I tried to make sure height: 32px for those element as well, but I could not figure out why the height of gaps differ than the below ones. I want them to be same as the below ones.
http://paulz.dev.biznessapps.com/global/signup_subscribe?plan=mobileapp59
I used Recurly JS v4.
https://js.recurly.com/v4/recurly.js
Thank you!
Paul
you can customise styling on input fields as in here.
https://dev.recurly.com/docs/getting-started-1#section-styling-card-fields
Please try this code
iframe {
height: 26px!important;
}
Any Javascript expert could help me here.
i am a template developer and i use this script to show my footer link in every free template created by me. and when someone trying to remove footer link their site redirected to my site example.com...
But What
some users download my template and hide my footer link with this CSS property: visibility:hidden
script is here that i use in template bottom,
abc
And some users add visibility:hidden to footer link in template like this. check in here.
<a id="credit" href="http://www.example.com"><a target="_blank" href="http://www.example.com/">abc</a></a>
So, my point is here, that what should add in first script, so that if someone add visibility:hidden and then it should redirected to my official site example.com
if ($('#myContent').css('visibility') === 'hidden')
window.location('http://wherever');
This?
Edit: Of course, #t.niese is right and this is really an exercise in futility.
What if you detect style change event on your element?
MutationObservers - Is this useful for you?
MutationEvents - also please take look at this
You could also try to obfuscate your code and maybe use javascript singleton function pattern.
I'm so new to web development that I'm not exactly sure how to ask this question, but here's the problem I'm facing.
I'm developing a website for a particular department in a university with its own stylesheets that are applied but that I'm unable to edit. I'm trying to make a collage of images for the purpose of site navigation - when you mousehover over an image, I want a different image to be swapped. The first method I used was javascript:
<div class="box">
<a target="_blank" href="http://bike.cofc.edu/"><img src="../biking" onmouseover="this.src='../biking-label'" onmouseout="this.src='../biking'" class="icon" alt="biking" /></a>
</div>
This worked beautifully within the cms, but when I published the image swap didn't occur - onmouseover caused the first image to disappear but the second image was not called successfully, and onmouseout didn't reverse the broken swap.
I thought that perhaps the university wasn't allowing my javascript, so I tried using just css and html:
span.imgswap-biking {
background-image:url("");
background-size:100px 100px;
border: 1px solid black;
background-repeat: no-repeat; display:block;
}
span.imgswap-biking:hover img {
visibility:hidden;
}
</style>
<span class="imgswap-biking">
<img src="" alt="biking" />
</span>
Again, this accomplished the same effect within cms, but when I published, the swap occurred and was reversible, but the background image was not successfully called. I'm afraid that background isn't recognized.
My fundamental confusion is understanding how functionality is lost when publishing websites. I don't really understand what goes on between the time that my site looks good on cms and the time that it is stripped when it is published. General guidance on how to know what sorts of scripts and css changes will work would be helpful if possible. I should mention that I am including css at the top of the webpage because I don't have access to the stylesheet - will the university stylesheet always override mine? Thanks in advance.
Walt
The NoScript browser plugin is getting increasingly popular. For those of us who run webpages which are heavily dependent on javascript, how can we check for presence of this plugin and alert the user with some sort of "always present" drop down bar at the top of the screen if so?
I actually just tried using NoScript on StackOverflow.com and saw that they do EXACTLY what I was thinking about! Is this just a simple browser check for javascript?
Open the source of a Stack Overflow page and look around.
You see that they are using <noscript>-tags to add additional content when no JavaScript is available.
A simple manual implementation would be to do something like this:
HTML:
<div id="requireJS">This site requires JS!</div>
Script:
var warning = document.getElementById('requireJS');
warning.parentNode.removeChild(warning);
This'll show the warning when JS is disabled, and remove it when JS is enabled.
Note: I'm not saying it's better than <noscript>, just that it could also be done this way.
Using Answer from agam360 in case somebody searches for the NoScript plugin again as I did.
How to detect if JavaScript is disabled?
And most specifically, the answer by Hairbo which seems like the best solution as I see it for already developed websites which do not have an elegent degradation: https://stackoverflow.com/a/3926750/646456
Actually I like the style approach so you can hide / unhide anything easily.
on default stylesheet :
.nojs { display:none;}
On layout html:
<noscript>
<style>
.nojs { display:block }
.container {display:none}
</style>
</noscript>
<div class="container">
this will show with js
</div>
<div class="nojs">
this will show without js
</div>
I am trying to add a single most recent tumblr post to another page.
I found the easiest way is to use the Javascript code provided by tumblr
here is what they offered:
<script type="text/javascript" src="http://occupy837.tumblr.com/js"></script>
adding ?num specifies the number of posts, so I can see that I am almost there
<script type="text/javascript" src="http://occupy837.tumblr.com/js?num=1"></script>
when I go to the page
(www.Occupy837.com) One single post shows up!
my only issue now is that it has a single 1 on the left of the post
tumblr quotes "[use the] code to embed your posts as basic HTML that you can skin with CSS:"
Does anyone have any idea how I can remove that number?! what do I have to do with CSS to make that disappear!
Add this to your css
li.tumbler-post {
list-style: none;
}
Here is the answer!
after doing some research I found this to be the solution:
ol.tumblr_posts{
list-style:none;
}
be careful not to type "tumbler" because it is always without the "e"
My friend ran into this last night and tumblr exactly provides something that is pretty decent but with very few documentation. Every tumblr post has CSS classes. The above answers work. If you need to know more about the classes tumblr provides right click a post and click inspect element.
You can add these classes to the CSS of your website. Adjusting the CSS of tumblr doesn't effect it.
Adding the above CSS will fix this issue.