I try get value for style and also in side this tag values for background-image
I do this little script :
function url_image(id){
var valimg = jQuery("."+id+". cycle-slide").attr("src");
alert('' + valimg);
}
<div onclick="url_image('imm_1');" class="imm_1 cycle-slide" style="background-image:url('website.com/image.jpg')"></div>
The idea it´s that when i do click over the div, send the value of background-image to the script and show, but no get this because i don´t know how get the value from tag style. That´s all problem
You can use :
var valimg = jQuery("."+id+".cycle-slide").css("background-image")
Like #Musa mentioned in comment.
Hope this helps.
Related
I have 50 divs that have all the same class (.marker), and an id (#a1, #a2, ...).
Now I want, that if I hover over such a div a JavaScript function is called that returns the css-left attribute of the specific div:
function(divId){
return $(divId).css("left");
}
And I don't know how to do that without having to write a function call to every div.
I thought of something with this.css("left"), that saves me typing work.
Thanks for your help in Advance...
You can't return a value from a click handler. But, you can change your approach to changing a variable
var currentLeft;
$('.marker').hover(function(){
currentLeft = $(this).css('left');
});
I have added an onclick function to a div here:
<script type="text/javascript">
document.getElementById("fab").onclick = function() {
location.href = 'http://your.url.here';
}
</script>
When you hover over the div, it doesnt show the URL in the bottom left of the browser like an anchor tag does (see picture): http://i.stack.imgur.com/iGLHS.png
Is there any way to make the browser show the link, when it has been added with javascript?
Add the title attribute to your element:
<div id="fab" title="http://your.url.here'></div>
Actually this is different than the popup you're seeing, but it might be as close as you can get.
As #Benten points out, you'd have to set window.status, which isn't allowed by most modern browsers.
I don't think you can directly access the property that you are looking for any more. Usually it's ignored. See this: http://www.w3schools.com/jsref/prop_win_status.asp . I'd say the other answer is your best bet.
I think something different. I hope i didnt understand it wrong. If you add -a- element as parent to your -div- it acts like what you want.
var element = document.getElementById("fab");
var aa = document.createElement("a");
aa.setAttribute('href', 'http://www.google.com');
var parent = element.parentNode;
parent.insertBefore(aa, element);
aa.appendChild(element);
please let me know if i understand it wrong?
The div is a switch which gets a dynamic ID .
class name is impbtn , id is generated in variable this.impbtn6.id
HTML:
<div id="widget-id63032Candy_Eaten_importGoodsBtn" class="impbtn"></div>
There are two places hide is required - click and onload
In click event
document.getElementById(this.impbtn6.id).style.visibility="hidden";
works fine .
I cannot use Document.getelementbyID , as multiple form loads occur and button is not supposed to be hidden then .
So i trued using JQ to access css properties
This
jQuery('.impbtn, #this.impbtn6.id').css('visibility',"hidden");
works but makes all button in the class invisible . I want to make only this.expbtn6.id invisible not all ids under this class .
I have read each and every page available.Some things Iv unsuccessfully tried (Separately)
var vid= this.impbtn6.id;
jQuery("#"+ vid).visibility("hidden");
$('#vid .impbtn').css('visibility',"hidden")
var row2=$(".impbtn").find("div#"+vid);
row2.hide();
$('#vid .impbtn').css('visibility',"hidden");
$('div#vid').css('visibility',"hidden");
$('.impbtn', $("#div" + this.impbtn6.id)).css('visibility',"hidden");
$("#div"+ vid).css('visibility',"hidden");
$("#"+ vid).hide();
$('#vid').css('visibility',"hidden");
row = $('#' + vid);
row.css('visibility',"hidden");
I would highly appreciate a reply/comment.
your question is a little confusing as you say
document.getElementById(this.exportbtn6.id).style.visibility="visible";
works fine but this code shows the div, not hides it, and why cannot the same code be used to hide if you use it to show?
then your other snippet that supposedly works:
jQuery('.expbtn, #this.exportbtn6.id').css('visibility',"visible");
cannot work because #this.exportbtn6.id will not resolve to the variable's content inside the double quotes, so i am pretty sure this line will not do anything.
The way to do this correctly is
jQuery('#' + this.exportbtn6.id + '.expbtn').hide();
but i cannot tell for sure as the question is not clear. If my understanding of your question is correct, the above line will do the trick. Keep in mind that the value of "this" will differ based on context, so it maybe that you are referencing the wrong "this".
Try this
$('#this.exportbtn6.id').css('visibility','visible');
With jQuery:
$("#"+this.expbtn6.id).hide();
I hope it helps.
I want to click all the links on a page that have a certain image src.
I know I can do the following if I know the id:
alert(document.getElementById('image').src);
But I know know the src and nothing else is there. No id, alt or title, nothing only src.
Anyone have any idea on how to do this? Thanks!
Easy.. though please read jquery's documentation when you get the chance:
$("img[src='src_goes_here']").trigger("click");
Assuming you want to click the link that has a child image with a particular source..
$("a img[src='src_goes_here']").parent().trigger("click");
I'm not sure what you mean with "clicking links with a certain image-src", as clicking would be a user-interaction and links don't tend to have a src - attribute like the <img>-tag
Anyhow, using jQuery as example, there is something called "Attribute-Selectors", in your case the Attribute Equals Selector (jQuery-API) should do the trick:
var yourSource = "/path/to/image.jpg";
var myImages = $('img[src="'+ yourSource +'"]');
So, for example, if your images are inside a link, all you'd need to do is:
myImages.parent().trigger('click');
but I really don't know what good that should do
$('img[src="' + yourKnownSrc + '"]').click();
In case you want to click links "having" an image:
$('a').has('img[src="' + yourKnownSrc + '"]').click();
I have a JS file CharacterSelection where a user can select an avatar and type their name into a textarea.
Now I want to set a text div in an html file to the contents of the textarea. I will use it to display the player's name at a specific location on the screen.
I know that I can set a div to a text, such as: <div id ="statSheetExitButton">Exit</div> will show "Exit" (style and location depending on css)
I'm wondering if there is any way to put a String variable in there, since I will not know what name the player enters.
I grab the textarea's contents using var name = $("#nameTextBox").val();
I'm thinking that saying <div id ="playerName">name</div> will display the text "name".
Is there a way to accomplish my goal?
$("#nameTextBox").change(function(){
$("#playerName").html($(this).val());
});
This will attach an event handler to the textbox so everytime the name changes the div is updated.
Here is a working example. http://jsfiddle.net/2NkTb/
Please note that for the onchange event you must tab out of textbox or the textbox must lose focus
var name = $("#nameTextBox").val();
$("#playerName").html(name);
Do this:
var name = $("#nameTextBox").val();
$('#playerName').text(name);
You could do something like this which will replace the html of the tag with your JavaScript string:
$('#playerName').html(myNameVar);
Other than that, I don't think you can directly inject JavaScript variables like you would in a template language.
Try:
$('#playerName').html($("#textbo").val());
var playerName = 'John Dow'
document.getElementById('playerName').innerHTML=playerName
You need to set the property innerHTML of you div element.
$("playerName").innerHTML = name;