Recently I was able to load javascript in webbrowser before downloading source with this code:
WebBrowser1.Document.Window.DomWindow.execscript("text/JavaScript")
Dim MSDNpage2 As String = WebBrowser1.Document.Body.InnerHtml
My.Computer.FileSystem.WriteAllText("e:\msdn2.txt", MSDNpage2, True)
RichTextBox6.Text = MSDNpage2
Unfortunately, the first line causes a browser error. The following code:
WebBrowser1.ScriptErrorsSuppressed = True
I turn off the notifications, but in this case, the source does not link one I care about. Therefore I ask for your help in solving this problem. I thought that automatic clicking on the 'no' could help, but I could not locate the process responsible for displaying a message.
I don't known how to set attributes, when i've got no error, then code is looks like this:
<DIV id=serialInfoBox>
<DIV class=l>
<DIV class=progressBar>
<DIV class=o>
<DIV style="WIDTH: 0px" class=i></DIV></DIV></DIV><HGROUP>
<H2>SGU Stargate Universe</H2></HGROUP></DIV>
<DIV class=r><IMG src="/static/serials/stargate-universe_small.jpg"> </DIV></DIV>
<DIV id=player>
<DIV id=player_2 hash="wZlV90mq4I3LgyGB6WGIgyKJvMzHhS2EvAGqhWmI25JIRMyrXIUnjAmAeIKJZqQJcIGBV1HInuKLuS2LnS1ZHWTMDqGrBk0FF9FAPSxMvuSJnAxLjZxHXy1IdSzEiSHJ1W1M" jQuery110007841996969566763="5"></DIV>
<DIV class=clearfix></DIV></DIV></DIV>
<DIV id=underPlayer><A class=l href="odcinek,stargate-universe,lost,s01e15.html">poprzedni odcinek</A> <A class=c watched="0" jQuery110007841996969566763="19">zaznacz jako obejrzane</A> <A class=r href="odcinek,stargate-universe,pain,s01e17.html">następny odcinek</A> </DIV>
<SCRIPT type=text/javascript>
$(document).ready(function() {
$('#langs li').click(function(e) {
e.preventDefault();
$('#players li').hide();
$('#players li.'+$(this).attr('id')).show();
$('#langs li').removeClass('active');
$(this).addClass('active');
});
$('#player_2').click(function(e) {
$.post("getVideo.html", {hash: $(this).attr('hash')}, function(data) {
$('#player').css('background','#000').css('text-align','center');
$('#player').html(data);
$('html, body').animate({
scrollTop: $("#player").offset().top-27
}, 1000);
});
});
$('#players a.switcher').click(function(e) {
e.preventDefault();
$.post("getVideo.html", {hash: $(this).parent().attr('hash')}, function(data) {
$('#player').html(data);
$('html, body').animate({
scrollTop: $("#player").offset().top-27
}, 1000);
});
});
$(document).on('click','a.tup',function(e) {
e.preventDefault();
var c_id = $(this).parent().attr('cid');
$.post("commentVote.html",{cid: c_id, mode: "up"}, function(data) {
if (data >= 0) {
$('#cid'+c_id+' span').removeClass('red').removeClass('green').addClass('green');
data = '+'+data;
} else {
$('#cid'+c_id+' span').removeClass('red').removeClass('green').addClass('red');
}
$('#cid'+c_id+' span').html(data);
$('#cid'+c_id+' .tup').remove();
$('#cid'+c_id+' .tdown').remove();
}) ;
});
$(document).on('click','a.tdown',function(e) {
e.preventDefault();
var c_id = $(this).parent().attr('cid');
$.post("commentVote.html",{cid: c_id, mode: "down"}, function(data) {
if (data >= 0) {
$('#cid'+c_id+' span').removeClass('red').removeClass('green').addClass('green');
data = '+'+data;
} else {
$('#cid'+c_id+' span').removeClass('red').removeClass('green').addClass('red');
}
$('#cid'+c_id+' span').html(data);
$('#cid'+c_id+' .tup').remove();
$('#cid'+c_id+' .tdown').remove();
}) ;
});
$('#underPlayer .c').bind('click', function() {
var el = $(this);
if ($(this).attr('watched') == 0) {
$.ajax({type: "POST", url: "/reports,seen.html",timeout: 10000,data: "user=1075505&ep=38361", success: function(data) {
if (data == 1) {
el.html('oznacz jako nieobejrzane').attr('watched','1');
}
}
});
} else {
$.ajax({type: "POST", url: "/reports,seen.html",timeout: 10000,data: "user=1075505&rem=1&ep=38361", success: function(data) {
if (data == 1) {
el.html('zaznacz jako obejrzane').attr('watched','0');
}
}
});
}
return false;
});
})
</SCRIPT>
and there is no link I need, but when there is my link, then i've got an error and code looks like this:
<DIV id=serialInfoBox>
<DIV class=l>
<DIV class=progressBar>
<DIV class=o>
<DIV style="WIDTH: 0px" class=i></DIV></DIV></DIV><HGROUP>
<H2>SGU Stargate Universe</H2></HGROUP></DIV>
<DIV class=r><IMG src="/static/serials/stargate-universe_small.jpg"> </DIV></DIV>
<DIV style="TEXT-ALIGN: center; BACKGROUND: #000" id=player>
<DIV style="POSITION: relative; WIDTH: 750px">
<DIV style="Z-INDEX: 0; TEXT-ALIGN: center; WIDTH: 750px; BACKGROUND: #000; COLOR: #fff">
<DIV class=embed>
<DIV style="Z-INDEX: 0; POSITION: relative; WIDTH: 750px; HEIGHT: 429px; CLEAR: both"><SPAN id=aeceedb4c2667cf66b0cfe9780811fa6></SPAN></DIV>
<SCRIPT type=text/javascript src="http://premium.iitv.info/static/player/flowplayer-3.2.11.min.js"></SCRIPT>
<SCRIPT type=text/javascript>
$(document).ready( function(){
$f("aeceedb4c2667cf66b0cfe9780811fa6", "http://premium.iitv.info/static/player/flowplayer.commercial-3.2.15.swf", {
key: '#$3f90d28e7547ada6c98',
clip: {
here is url: ---> url: 'http://stream.streamo.tv/?scode=wZvoQAIH41HF5MxJiH2MAg0YeVKAFATnLMTGluyIl4HFeZyGCAUFhqGM5DREz9JnlM2MUAJEmq3HlSIBVgxq6OKqeRxHDATERSUZTAmqkHGn5cJA1yyZgA0pKcHDdAmMkRGZ2A2pfWKqeSKD4NUIQkRqVWwEIcRrLWmEKIaJbERnDgPFcW3A2RwAj52F6MUIgMyADImXjfvq2EKoMAJGxywD0y0Az50HeLmIy1zM0WTA19FBgWTIBc0FWWTAUAwrCuaEASKIiHQplWwMwMxZm9HZeO1FGMSHMSyELEwZaSRqXSHMjWmX6W2AUOUG2I2DmM0YU9RqjgFAiS0XLcJBDcJBQEQnLcJD142IaM0AL50nSOQJkkxEBSHrBMQBIOmM2qaqGgxo5SzJdAIpjymZ5bKLlyxrDuSokNyZ4ExZPqIJkVwpyqSZbMwZxITEjVIFyqSZIMaMPuUIeSxF5RSHzEQGIyTnIA3o2LwIJ1ToPE1DFyTpUqRqiHHpuSTF0RypBqmpacaG',
provider: 'lighttpd',
scaling: 'fit',
backgroundGradient: 'none',
autoPlay: false,
autoBuffering: false
},
canvas: {
backgroundColor:'#000',
backgroundGradient: 'none'
},
plugins: {
lighttpd: {
url: 'flowplayer.pseudostreaming-3.2.11.swf',
queryString: escape('?start=${start}')
},
controls: {
url: 'flowplayer.controls-3.2.14.swf',
autoHide: 'always'
}
}
});
});
</SCRIPT>
Related
I'm using the Magnific popup for to show the popup in my site, it's worked well in all browsers and smartphones, however it happened a problem on the iPhone, when I scroll the page with popup open, the "body" scroll together.
This is my jQuery code:
if ($.fn.magnificPopup) {
$('.open-popup').magnificPopup({
type: 'inline',
alignTop: true,
midClick: true,
fixedContentPos: true,
removalDelay: 300,
mainClass: 'modulos-popup fade-popup'
});
$.extend(true, $.magnificPopup.defaults, {
tClose: 'Fechar (Esc)',
tLoading: 'Carregando...'
});
}
yeah I'm facing the same problem seems like the following patch is working for me:
utils.js(useful if you are using the popup in different places)
window.Utils = {
magnificPopupConfiguration: function() {
var startWindowScroll = 0;
return {
beforeOpen: function() {
startWindowScroll = $(window).scrollTop();
$('html').addClass('mfp-helper');
},
close: function() {
$('html').removeClass('mfp-helper');
setTimeout(function(){
$('body').animate({ scrollTop: startWindowScroll }, 0);
}, 0);
}
}
}
}
css:
.mfp-wrap {
-webkit-overflow-scrolling: touch;
-webkit-transform: translateZ(0);
}
html.mfp-helper {
height: 100%;
body {
overflow: hidden;
height: 100%;
-webkit-transform: translateZ(0);
}
}
Preparing the js:
$(document).ready(function() {
if ($('.open-popup-link').length) {
startWindowScroll = 0;
$('.open-popup-link').magnificPopup({
type: 'inline',
midClick: true,
fixedContentPos: true,
callbacks: Utils.magnificPopupConfiguration()
});
}
});
html:
<a class="open-popup-link" href="#your-html-content">text link</a>
this code works just fine, but the second input field does not show images appearing with the text suggestions. I would appreciate if someone could take a look and let me know what needs to be changed in the js for it to work.
Example queries: clinton, bush
you can see the script here http://predcast.com/include/autoc/jqui/test2.php
<!DOCTYPE html>
<html>
<head>
<title>jQuery UI Autocomplete: Custom HTML in Dropdown</title>
<link href="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/themes/smoothness/jquery-ui.min.css" rel="stylesheet">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> </script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/jquery-ui.min.js"></script>
<style>
.loading {
display: none;
width: 16px;
height: 16px;
background-image: url(/img/loading.gif);
vertical-align: text-bottom;
}
#autocomplete.ui-autocomplete-loading ~ .loading {
display: inline-block;
}
.ui-menu-item {
padding:1px;
margin:1px;
}
.ac-m {
height:block;
overflow:auto;
padding:2px 2px 2px 2px;
}
.ac-img {
max-width:30px;
float:left;
margin:2px 2px 2px 2px;
}
.ac-title {
margin:1px;
font-size:14px;
}
.ui-autocomplete {
margin:1px;
}
</style>
</head>
<body>
<form action="http://www.test.com/">
<input class="autocomplete" type="text" placeholder="Option 1" name="e1">
<input class="autocomplete" type="text" placeholder="Option 2" name="e2">
<span class="loading"></span>
</form>
<script>
/*
* jQuery UI Autocomplete: Custom HTML in Dropdown
* http://salman-w.blogspot.com/2013/12/jquery-ui-autocomplete-examples.html
*/
$(function () {
$('.autocomplete').autocomplete({
delay: 500,
minLength: 3,
source: function (request, response) {
$.getJSON("http://predcast.com/include/autoc/jqui/jsond.php", {
q: request.term,
}, function (data) {
var array = data.error ? [] : $.map(data.movies, function (m) {
return {
label: m.title,
year: m.year,
img: m.img,
};
});
response(array);
});
},
focus: function (event, ui) {
event.preventDefault();
},
}).data("ui-autocomplete")._renderItem = function (ul, item) {
var $a = $("<div class='ac-m'></div>");
if (item.img) {
$("<span></span>").addClass(item.icon).appendTo($a).append("<img src='" + item.img + "' border='0' class='ac-img' />");
}
$("<span class='ac-title'></span>").text(item.label).appendTo($a);
return $("<li></li>").append($a).appendTo(ul);
};
});
</script>
</body>
</html>
The problem is related to the way you are defining the _renderItem extension point.
In your code, you are redefining the jquery-ui autocomplete _renderItem function only for your first widget instance, so the _renderItem for your second autocomplete instance is the default one defined in the jquery-ui code.
You are initializating the autocomplete for your 2 inputs with this $('.autocomplete').autocomplete({ ...}) then you get the first widget instance with this instruction .data("ui-autocomplete") and then redefine the _renderItem function for this instance only.
You can define it for all your instances like this:
// Create your widget instances
$('.autocomplete').autocomplete({
delay: 500,
minLength: 3,
source: function (request, response) {
$.getJSON("http://predcast.com/include/autoc/jqui/jsond.php", {
q: request.term,
}, function (data) {
var array = data.error ? [] : $.map(data.movies, function (m) {
return {
label: m.title,
year: m.year,
img: m.img,
};
});
response(array);
});
},
focus: function (event, ui) {
event.preventDefault();
}
});
// Then redefine the _renderItem for each instance
$('.autocomplete').each(function() {
$(this).data('ui-autocomplete')._renderItem = function (ul, item) {
var $a = $("<div class='ac-m'></div>");
if (item.img) {
$("<span></span>").addClass(item.icon).appendTo($a).append("<img src='" + item.img + "' border='0' class='ac-img' />");
}
$("<span class='ac-title'></span>").text(item.label).appendTo($a);
return $("<li></li>").append($a).appendTo(ul);
};
});
I'm trying to change the color of an SVG object with a jQuery, but after that i want to reset all fill attribute in class st24.
But after reset setAttribute doesn't work.
//Автокомплит
$(function() {
$( "#users" ).autocomplete({
source: function( request, response ) {
$.ajax({
cache: true,
url: "http://127.0.0.1/json.php",
dataType: "json",
success: function(data) {
response($.map(data, function(item){
return {
label: item.username,
placeId: item.LocationInfo.placeId,
}}));
}
});
},
minLength: 2,
select: function(event,ui) {
$('#users').val(ui.item.username);
$('#placeId').val(ui.item.placeId);
console.log(ui.item.placeId);
console.log(svgdom);
var svgElement = svgdom.getElementById(ui.item.placeId);
//Если id елемента есть в svg файле - меняем аттрибур fill, если нет генерируем алерт
if (svgElement) {
var st24 = svgdom.getElementsByClassName("st24");
$.each(st24, function( i, val) {
val.setAttribute("fill", "none");
});
svgElement.setAttribute("fill", "#008000");
} else {
generate('information');
}
}
});
});
});
If i try this:
$.each(st24, function( i, val) {
val.setAttribute("fill", "#008000");
});
work perfect - all elements have this attribute, but when i change setAttribute fill to none, and add this line: svgElement.setAttribute("fill", "#008000"); after this code, it doesn't work - why ?
Update:
This all my code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="libs/jquery-2.1.1.min.js"></script>
<script src="libs/jquery-ui-1.10.4.js" type="text/javascript"></script>
<script src="libs/jquery.panzoom.js"></script>
<script src="libs/jquery.mousewheel.js"></script>
<script src="libs/noty/packaged/jquery.noty.packaged.min.js" type="text/javascript"></script>
<script src="libs/svg-pan-zoom.min.js"></script>
<link href="css/style.css" rel="stylesheet">
<link type="text/css" href="css/jquery-ui-1.10.4.custom.css" rel="stylesheet" />
</head>
<body>
<a id="link" href="admin.html">Admin</a>
<div class="ui-widget">
<label for="users">users: </label>
<input id="users" type="text" />
<input readonly="readonly" id="placeId" name="placeId" />
</div>
<embed src="svg/5.svg" width="900" height="900" id="imap"/>
<script>
//Всплывающие сообщения
function generate(type) {
var n = noty({
text : "Sorry place not found",
type : type,
dismissQueue: true,
layout : 'topCenter',
theme : 'defaultTheme',
timeout: 2000,
});
}
function generateInf() {
generate('information');
}
// Начинаем работу когда страница полностью загружена (включая графику)
$(window).load(function () {
// Получаем доступ к SVG DOM
var svgdom = document.getElementById('imap').getSVGDocument();
svgPanZoom('#imap', {
zoomEnabled: true,
controlIconsEnabled: true
});
function clearSvg() {
var st24 = svgdom.getElementsByClassName("st24");
$.each(st24, function(i, val) {
val.removeAttribute("fill");
});
}
function setColor(elem) {
elem.setAttribute("fill", "#008000");
}
//Автокомплит
$(function() {
$( "#users" ).autocomplete({
source: function( request, response ) {
$.ajax({
cache: true,
url: "http://127.0.0.1/json.php",
dataType: "json",
success: function(data) {
response($.map(data, function(item){
return {
label: item.username,
placeId: item.LocationInfo.placeId,
}}));
}
});
},
minLength: 2,
select: function(event,ui) {
$('#users').val(ui.item.username);
$('#placeId').val(ui.item.placeId);
console.log(ui.item.placeId);
console.log(svgdom);
var svgElement = svgdom.getElementById(ui.item.placeId);
//Если id елемента есть в svg файле - меняем аттрибур fill, если нет генерируем алерт
if (svgElement) {
clearSvg();
setColor(svgElement);
} else {
generate('information');
}
}
});
});
});
</script>
</body>
</html>
Setting fill to none doesn't delete the fill. It is saying "this element has no fill". So setting fill on the <svg> parent doesn't override that. The value on the child takes precendence.
If you want to remove the fill setting from the children use
val.removeAttribute('fill');
Update
Try something like this:
if (svgElement) {
var st24 = svgdom.getElementsByClassName("st24");
$.each(st24, function( i, val) {
val.removeAttribute("fill");
});
svgElement.setAttribute("fill", "#008000");
} else ...
Update 2
Have a look at this fiddle. Hopefully it should help explain what I mean.
http://jsfiddle.net/gt7nd/1/
Use this
$(val).css('fill',"#008000");
or this
val.style.fill = "#000800"
My SVG code:
<g id="505Б-1" place="place" v:mID="1937" v:groupContext="shape" transform="translate(206.929,-334.488)" class="test">
<title>Circle, ellipse.1937</title>
<v:userDefs>
<v:ud v:nameU="visVersion" v:val="VT0(14):26"/>
</v:userDefs>
<path transform="" d="M0 837.64 A4.25197 4.25197 0 0 1 8.5 837.64 A4.25197 4.25197 0 1 1 0 837.64 Z" class="st24"/>
</g>
I use class "test" instead "st24", and everything works now!
Here is my js:
<script type="text/javascript">
$(document).ready(function() {
checkurl("google.com", "#google")
});
function setpanelToRed (panel){
$(panel+".list-group-item-success").animate({backgroundColor: "#d9534f"}, 1000);
}
function setpanelToYellow (panel){
$(panel+".list-group-item-success").animate({backgroundColor: "#d9534f"}, 1000);
}
function setpanelToGreen (panel){
$(panel+".list-group-item-success").animate({backgroundColor: "#d9534f"}, 1000);
}
function checkurl (link, panel){
var url = "/redir/"+link;
$.ajax(url,
{
statusCode: {
200: function() {
setpanelToGreen(panel);
},
404: function() {
setpanelToYellow(panel);
},
000: function() {
setpanelToRed(panel);
},
302: function() {
setpanelToGreen(panel);
}
}
});
setTimeout ( checkurl, 5000, link, panel);
}
</script>
And the item it is changing looks like this:
<div id="#google" class="list-group-item list-group-item-success" style="background-color: #5cb85c; color: #fff"><center>google</center></div>
I have changed it to remove some sensitive things, but I use this on 2 different pages, and it works perfectly in chrome, but doesn't work in firefox/ie(most of my test site doesn't work in ie, but that doesn't matter as much to me.
A page on my site are auto-reloading every 15th second. It's being done by using jQuery's .ajax function.
My problem are, that everytime the page are being loaded by the user, the form in the dialogs work fine.
But when it's reloaded automatically by the page itself, the inputs are being moved OUTSIDE the form.
Many on the internet writes, that it is possible to move it back into the form by appending a div into the first form found. My problem is, that when i try to move my "input-wrapper" back into the form, i get a hirachy-problem.
Can anyone help? Or point out an alternative solution?
My jQuery-script:
<script type='text/javascript'>
var intval;
var xmlhttp;
function init() {
$('#dialog:ui-dialog').dialog('destroy');
$('.ui-dialog').dialog({ modal: true, draggable: false, resizable: false, autoOpen: false, open: function(event, ui) { stopTimer(); }, close: function(event, ui) { startTimer(); } });
$('#targets').dialog({ width: 400, buttons: { 'close': { text: 'Luk', height: '30px', click: function() { $(this).dialog('close'); } }, 'submit': { text: 'OK', class: 'submit', height: '30px', click: function() { $(this).find('form').trigger('submit'); } } } });
$('#targets" & id2 & "Opener').click(function() { $('#targets').dialog('open'); return false; });
};
function startTimer() { intval = setTimeout('ajaxRefresh()', 15000); };
function stopTimer() { clearTimeout(intval); if(xmlhttp) xmlhttp.abort(); };
function ajaxRefresh() { xmlhttp = $.ajax({ url: '/', data: {h: 'ok'}, beforeSend: function() { stopTimer(); }, success: function(result) { $('body').html(result); } } }) };
$(document).ready(function() { init(); startTimer(); $('#targetsFormWrap').parent().appendTo('#targetsForm'); });
</script>
The HTML:
<div id='targets' class='ui-dialog' title='The Dialog Title' style='text-align: center; display: none;'>
<form id='targetsForm' name='targetsForm' method='post'>")
<div id='targetsFormWrap'>")
<input id='input1target' name='input1target' type='text' value='' style='width: 95%; />
<input id='input2target' name='input2target' type='text' value='' style='width: 95%; />
<input id='input3target' name='input3target' type='text' value='' style='width: 95%; />
</div>
</form>
</div>
you are trying to add targetFormWrap to targetsForm right? so just do:
$("#targetsForm").append($("#targetsFormWrap"));