VLC activex windowless mode not working - activex

The feature was added in version 2.0.6
see http://wiki.videolan.org/Documentation:WebPlugin
<object style="z-index:0;position:relative" classid="clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921"
codebase="http://download.videolan.org/pub/videolan/vlc/last/win32/axvlc.cab" width="352" height="288" id="vlc">
<param name="Src" value="" />
<param name="windowless" value="True" />
</object>
<div style="width:50px;height:50px;position: absolute;z-index: 1000;background: green;top:0;left:0"></div>
The green div should be placed over the activex control, why is it not?.

Your green square will appear at the top left hand corner of the screen. You need to mess with the css to position it where your control appears.

Related

CSS issues in iOS Browsers

I've been developing a website with a custom menu (ReactJS). But it doesn't work in Chrome and Safari on iOS.
Below is the code structure.
<Header>
<TopNavigation />
<MenuBox />
</Header>
<PageBody>
<TextContainer />
<PageBody>
When menu box appears, it should cover the whole page. But on iOS, the <TextContainer /> comes on top of the menu bar.
z-index of <Header /> is higher than that of <PageBody />
Any advice on why this is happening and how to solve this would be great.
Anyway couldn't find the reason to that behaviour in iOS. Then changed the layout and made it work.
<Header>
<TopNavigation />
</Header>
<MenuBox />
<PageBody>
<TextContainer />
<PageBody>

iOS and PhoneGap, webview is always scrolling, how to make it scroll only if the webpage loaded is bigger than the webview size?

Using phonegap in iOS I have a webview which is resized via Objective-C code.
I've edited the self.webview frame to the 80% of the device screen size, this is working properly.
When I load an html page inside the webview using phonegap, the page is always scrolling even if the page I've loaded is blank (so it's content can't be bigger than the webview size).
How can I set my pages to scroll only if the content size is bigger than the webview size? actually my html pages are always scrolling a bit vertically, like if they're bigger than the webview size and even bigger of the screen size.
I would like to have my htlm pages to scroll only if the real content is bigger than the webview size.
Add the following lines to config.xml:
<preference name="UIWebViewBounce" value="false" />
<preference name="DisallowOverscroll" value="true" />
I had the same problem and tried the same (repeated) solution of
<preference name="UIWebViewBounce" value="false" />
<preference name="DisallowOverscroll" value="true" />
with NO RESULTS!!!
BUT... I found the solution today!!!
The problem is that we are using the "PAGE" data-role without defining a "CONTENT" data-role. I added it like this:
<div id="myPage" data-role="page">
<div id="myPageContent" data-role="content">
(here all the page!)
</div>
</div>
and worked perfect!
Hope it helps you!

Notification box positioning in XUL

Currently I have a XUL notification box being displayed as I am developing a Firefox Addon. At the moment the notification box will only display at the bottom of the browser and cannot find any information about changing the position to the top of the browser.
I know you can use priority_high etc... but it only seems to add this again at the bottom of the browser.
Code:
<notificationbox flex="0.1">
<browser src="http://www.mozilla.org"/>
<notification type="warning" label="Test"/>
</notificationbox>
Any help will be grateful.
I have tested with XUL Explorer, I could change the positions successfully.
Here is the code:
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<!-- your code here -->
<stack>
<hbox flex="1" left="100" right="10" top="50" bottom="10">
<notificationbox flex="0.1" >
<browser src="http://www.mozilla.org"/>
<notification type="warning" label="Test" />
</notificationbox>
</hbox>
</stack>
</window>

Load embed youtube video in fullscreen mode by button click - iOS

So the question is:
Can i load load embed youtube video in fullscreen mode, by button click, skip intermediate UIWebView?
Googling gave me only one answer - probably NO, but hope still alive.
Have you tried embedding the video as a fullscreen page?
Something like:
<object style="height: 768px; width: 1024px">
<param name="movie" value="http://www.youtube.com/v/gPLb9FVKoqI?version=3&feature=player_detailpage">
<param name="allowFullScreen" value="true">
<param name="allowScriptAccess" value="always">
<embed src="http://www.youtube.com/v/gPLb9FVKoqI?version=3&feature=player_detailpage" type="application/x-shockwave-flash" allowfullscreen="true" allowScriptAccess="always" width="1024" height="768">
...and then present it in a fullscreen UIWebView?
This is assuming you somehow generate yourself the embedded pages (which shouldn't be difficult if you know the video id)
Other than that, I don't see what other options you might have.

how to handler preference and interface of mozilla firefox addons?

I want to ask some questions:
What steps should I do to make the interface on mozilla firefox and handle all these interfaces.
interfaces that I want to make are:
status bar that consists of labels and pictures and if the status bar on the right click menu will display the active addons (addons menu inactive hidden) and preferences.
current web page on the right click, on the browser will display a context menu "terjemahkan" and there are pictures on the left-hand corner.
when I select the options button on the tools menu >> addons, users can adjust these addons settings with the radio buttons
when the context menu is selected then the browser window will show the desired results
the steps that I have done is:
i was made the status bar but why the picture I want not to appear when I've made as directed. as well as on the context menu, the image can not appear in the upper left corner of the menu like in general.
<?xml version="1.0"?>
<overlay id="inline_trans"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
xmlns:html="http://www.w3.org/1999/xhtml">
<!--
<script type="application/x-javascript" src="chrome://translator/content/script.js" />
<script type="application/x-javascript" src="chrome://translator/content/interface.js" />
-->
<!-- menu klik kanan pada halaman web -->
<popup id="contentAreaContextMenu">
<menuseparator />
<menuitem id="intransContextMenuPage"
image="chrome://inlinetrans/skin/imagesOn_kecil.png"
label="terjemahkan dengan intrans"
oncommand="inline.script.getText()" />
</popup>
<!-- pilihan menu pada status bar -->
<popupset>
<menupopup id="intransContextMenu">
<menuitem label="intrans nonaktif"
image="chrome://inlinetrans/skin/imagesOff_kecil.png"
hidden="true"/>
<menuitem label="intrans aktif"
image="chrome://inlinetrans/skin/imagesOn_kecil.png"
hidden="false"/>
<menuseparator />
<menuitem label="preferensi"/>
</menupopup>
</popupset>
<!-- ========================================= -->
<!-- statusbar-->
<statusbar id="status-bar">
<statusbarpanel id="status-bar-intrans"
image="chrome://inlinetrans/skin/imagesOn_kecil.png"
label="intrans"
context="intransContextMenu"
tooltiptext="intrans versi 1.0"
/>
</statusbar>
</overlay>
UI options preferences
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<!DOCTYPE overlay SYSTEM "chrome://inlinetrans/locale/options.dtd">
<dialog xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
id="translate-preferences"
title="&options.title;"
buttons="accept, cancel"
style="padding:0px; margin:0px;"
ondialogaccept="options.save()"
onload="options.init();"
onunload="options.deconstruct();">
<!--
<stringbundleset id="stringbundleset">
<stringbundle id="locale-properties" src="chrome://translator/locale/translator.properties"/>
<stringbundle id="properties" src="chrome://translator/content/translator.properties"/>
</stringbundleset>
-->
<!--
<script src="chrome://inlinetrans/content/options.js" />
-->
<description value="&options.desc;"
style="
background: #fff url('chrome://inlinetrans/skin/options.png') no-repeat;
min-width:400px;
min-height:40px;
padding-left:55px;
padding-top:10px;
margin:0px;
border-bottom: 2px solid #757575;
font-size:1.5em;"/>
<vbox style="padding:10px;">
<groupbox>
<caption label="&options.ui;"/>
<label value="&options.results.desc;"/>
<radiogroup id="display.results" style="padding-left:20px;">
<radio id="results.cat" value="category" label="&options.results.cat;"/>
<radio id="results.noncat" value="noncategory" label="&options.results.noncat;"/>
</radiogroup>
</groupbox>
</vbox>
</dialog>
The most confusing thing for me is how I do all the handler interface.
for example:
change the status of addons, from active to inactive
take the value of the selected radio button
I cannot give you an answer to all of your questions, partly because I don't know exactly what you want, but here is a start:
To show an image next to the menu item, you have to give the element the class menuitem-iconic as described in the documentation:
<menuitem id="intransContextMenuPage"
class="menuitem-iconic"
image="chrome://inlinetrans/skin/imagesOn_kecil.png"
label="terjemahkan dengan intrans"
oncommand="inline.script.getText()" />
I'm not sure for the statusbar, by I would follow the description in the documentation:
The following classes may be used to style the element. These classes should be used instead of changing the style of the element directly since they will fit more naturally with the user's selected theme.
statusbarpanel-iconic
Use this class to have an image appear on the statusbarpanel. Specify the image using the src attribute. The image will appear instead of the label.
You can get the value of the selected radio button by getting a reference to the radiogroup,access its property selectedItem which gives you a radio element and read the value property:
var value = document.getElementById('display.results').selectedItem.value;

Resources